Hello.
I don't know is this is error or may be i do something wrong... but .make-row() mixin don`t work correctly.
in my less file:
.product-view {
.make-row();
}
output css file is:
.product-view {
margin-left: -15px;
margin-right: -15px;
}
in bootstrap mixin.less file present row:
&:extend(.clearfix all);
and i thing that rule don`t work :(
i compile my less files via command line, under mac os x, with official $ lessc programm.
can you tell me what is wrong? if need more info just tell me please.
ps: at this moment i fix problem like:
.product-view {
.make-row();
.clearfix();
}
and in output css get:
.product-view {
margin-left: -15px;
margin-right: -15px;
}
.product-view:before,
.product-view:after {
content: " ";
display: table;
}
.product-view:after {
clear: both;
}
Might be a bug of bootstrap
The .make-row mixin works fine鈥攚e use it in the Bootstrap core.
.make-row(@gutter: @grid-gutter-width) {
margin-left: (@gutter / -2);
margin-right: (@gutter / -2);
&:extend(.clearfix all);
}
Your clearfix styles will be getting applied with the .clearfix class somewhere in your compiled CSS.
@mdo, thanks for reply.
Yes, i understand that it should be applied, but it's not.
I re-check it twice. Also i had think that my lessc program not updated, but
$ lessc -v
lessc 1.6.0 (LESS Compiler) [JavaScript]
At this moment i think that something wrong with lessc. I try compile with grunt, like bootstrap...
I can confirm I just ran into the same issue when upgrading to Bootstrap 3.1. The code worked fine in Bootstrap 3.0.2, but after upgrading, I was not seeing the clearfix's properly applied to any element with the .make-row() or similar mixin that used &:extend(.clearfix all);.
I'm also using less 1.6.0.
Reverting to .clearfix() from &:extend(.clearfix all); change from 0016c17f9307bc71fc96d8d4680a9c861f137cae does fix the problem.
in my mixins.less file i done next:
//
// Bootstrap core variables and mixins
// --------------------------------------------------
@import "../default/bootstrap/less/mixins.less";
//
// Mixins
// --------------------------------------------------
// Grid System
// -----------
// Creates a wrapper for a series of columns
.make-row(@gutter: @grid-gutter-width) {
.clearfix();
}
Successor issue: #12409.
If you fall here as I did (importing bootstrap 3.x grid + less), if less extend clearfix is not working, just do this somewhere in your project (as suggested by @dak and @klerik):
.row {
.clearfix();
}
Thank you guys.
Most helpful comment
in my mixins.less file i done next: