Browse files

Cleaned up the inline-block mixin.

* Change to the zoom method for gaining layout in legacy IE.
* By using "stack" layout for old Firefox, we only need one property.
* Only output the firefox properties when the legacy support is desired.
* Allow the vertical alignment of the inline block mixin to be
  configured or disabled.
  • Loading branch information...
kud authored and chriseppstein committed May 24, 2012
1 parent 50d3006 commit 84e9a684b9697d728a37abb14cb0aae2c4d2a790
Showing with 12 additions and 5 deletions.
  1. +12 −5 frameworks/compass/stylesheets/compass/css3/_inline-block.scss
@@ -1,12 +1,19 @@
@import "shared";
// Provides a cross-browser method to implement `display: inline-block;`
// Set `$inline-block-alignment` to `none` or `false` to disable the output
// of a vertical-align property in the inline-block mixin.
// Or set it to a legal value for `vertical-align` to change the default.
$inline-block-alignment: middle !default;
@mixin inline-block {
display: -moz-inline-stack;
-moz-box-orient: vertical;
// Provides a cross-browser method to implement `display: inline-block;`
@mixin inline-block($alignment: $inline-block-alignment) {
@if $legacy-support-for-mozilla {
display: -moz-inline-stack;
display: inline-block;
vertical-align: middle;
@if $alignment and $alignment != none {
vertical-align: $alignment;
@if $legacy-support-for-ie {
*vertical-align: auto;
zoom: 1;

0 comments on commit 84e9a68

Please sign in to comment.