Sha256: 01730f4ece467b368aa2f3f33ea631a8786b313f2914fe01c6a91c2c1fa06fe4

Contents?: true

Size: 1.86 KB

Versions: 2

Compression:

Stored size: 1.86 KB

Contents

// Horizontal list layout module.
//
// Easy mode using simple descendant li selectors:
//
//   ul.nav
//     +horizontal-list
//
// Advanced mode:
// If you need to target the list items using a different selector then use
// +horizontal-list-container on your ul/ol and +horizontal-list-item on your li.
// This may help when working on layouts involving nested lists. For example:
//
//   ul.nav
//     +horizontal-list-container
//     > li
//       +horizontal-list-item

@import "bullets";
@import "compass/utilities/general/clearfix";
@import "compass/utilities/general/reset";
@import "compass/utilities/general/float";

// Can be mixed into any selector that target a ul or ol that is meant
// to have a horizontal layout. Used to implement +horizontal-list.
@mixin horizontal-list-container {
  @include reset-box-model;
  @include clearfix; }

// Can be mixed into any li selector that is meant to participate in a horizontal layout.
// Used to implement +horizontal-list.
//
// :last-child is not fully supported
// see http://www.quirksmode.org/css/contents.html#t29 for the support matrix
//
// Setting `$padding` to `false` disables the padding between list elements
@mixin horizontal-list-item($padding: 4px, $direction: left) {
  @include no-bullet;
  white-space: nowrap;
  @include float($direction);
  @if $padding {
    padding: {
      left: $padding;
      right: $padding;
    }
    &:first-child, &.first { padding-#{$direction}: 0; }
    &:last-child, &.last   { padding-#{opposite-position($direction)}: 0; }
  }
}

// A list(ol,ul) that is layed out such that the elements are floated left and won't wrap.
// This is not an inline list.
//
// Setting `$padding` to `false` disables the padding between list elements
@mixin horizontal-list($padding: 4px, $direction: left) {
  @include horizontal-list-container;
  li {
    @include horizontal-list-item($padding, $direction); } }

Version data entries

2 entries across 2 versions & 1 rubygems

Version Path
compass-0.10.6 frameworks/compass/stylesheets/compass/utilities/lists/_horizontal-list.scss
compass-0.10.6.pre.1 frameworks/compass/stylesheets/compass/utilities/lists/_horizontal-list.scss