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