inline-block-list documentation
This commit is contained in:
parent
d20603296c
commit
bc12d26f17
@ -0,0 +1,30 @@
|
|||||||
|
---
|
||||||
|
title: Compass Inline-Block List
|
||||||
|
crumb: Inline-Block List
|
||||||
|
framework: compass
|
||||||
|
stylesheet: compass/utilities/lists/_inline-block-list.scss
|
||||||
|
layout: core
|
||||||
|
meta_description: set list-elements to inline-block so they appear horizontally while retaining their structure.
|
||||||
|
nav_stylesheet: compass/_utilities.scss
|
||||||
|
classnames:
|
||||||
|
- reference
|
||||||
|
- core
|
||||||
|
- utilities
|
||||||
|
---
|
||||||
|
- render 'reference' do
|
||||||
|
:markdown
|
||||||
|
Easy mode using simple descendant li selectors:
|
||||||
|
|
||||||
|
ul.nav
|
||||||
|
+inline-block-list
|
||||||
|
|
||||||
|
Advanced mode:
|
||||||
|
If you need to target the list items using a different selector then use
|
||||||
|
+inline-block-list-container on your ul/ol and +inline-block-list-item on
|
||||||
|
your li. This may help when working on layouts involving nested lists. For
|
||||||
|
example:
|
||||||
|
|
||||||
|
ul.nav
|
||||||
|
+inline-block-list-container
|
||||||
|
> li
|
||||||
|
+inline-block-list-item
|
Loading…
Reference in New Issue
Block a user