SASS: generated CSS not optimal -

SASS: generated CSS not optimal -

i trying larn sass. got snippet working generated css awful in opinion. css go in te same .container{ }. not 3 different shown below.

sass:

.container{ @extend %clearfix; @extend %text-truncate; @include border-radius(10px); }

genereted css:

.container{ ...clear prepare } .container{ ...text-truncate } .container{ ...clear border-radius }

what want:

.container{ ...clear prepare ...text-truncat ...clear border-radius }

this nature of @extend. if alter extend classes ordinary classes, way works way revealed.

@mixin my-mixin() { padding: 1em; } .a { color: red; } .b { border: 1px solid; } .foo { @extend .a; @extend .b; @include my-mixin(); }

compiles to:

.a, .foo { color: red; } .b, .foo { border: 1px solid; } .foo { padding: 1em; }

using extend only class suppresses name output. if extend classes not intended reuse, improve suited mixin.

see also: http://codereview.stackexchange.com/a/27910/26722

sass