dbroqua/KNACSS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

correction largeur des grilles sur IE

Browse source
This commit is contained in:
raphaelgoettter 2015-06-26 14:04:16 +02:00
parent da25bfdf42
commit 69c0d573eb
2 changed files with 13 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
less/_03-grids.less
View file

@ -27,7 +27,7 @@
[class*="@{kna-namespace}grid-"] > * {
flex: 0 0 auto;
display: block; /* IE fix */
width: ~'calc(100% * 1 / @{number} - @{gutter})';
width: ~'calc(100% * 1 / @{number} - @{gutter} - .01px)';
margin-left: @gutter;
}
@ -35,25 +35,25 @@
// example : .grid-perso { .grid(12); }
.grid(@number:@number, @gutter:@gutter) {
& > * {
width: ~'calc(100% * 1 / @{number} - @{gutter})';
width: ~'calc(100% * 1 / @{number} - @{gutter} - .01px)';
}
& > .@{kna-namespace}flex-item-double {
width: ~'calc(100% * 2 / @{number} - @{gutter})';
width: ~'calc(100% * 2 / @{number} - @{gutter} - .01px)';
}
@media (min-width: (@tiny-screen + 1)) and (max-width: @small-screen) {
& > * {
width: ~'calc(100% * 1 / 2 - @{gutter})';
width: ~'calc(100% * 1 / 2 - @{gutter} - .01px)';
}
& > .@{kna-namespace}flex-item-double {
width: ~'calc(100% - @{gutter})';
width: ~'calc(100% - @{gutter} - .01px)';
}
}
@media (max-width: @tiny-screen) {
& > * {
width: ~'calc(100% - @{gutter})';
width: ~'calc(100% - @{gutter} - .01px)';
}
& > .@{kna-namespace}flex-item-double {
width: ~'calc(100% - @{gutter})';
width: ~'calc(100% - @{gutter} - .01px)';
}
}
}

12
sass/_03-grids.scss
View file

@ -27,7 +27,7 @@
[class*="#{$kna-namespace}grid-"] > * {
flex: 0 0 auto;
display: block; /* IE fix */
width: calc(100% * 1 / #{$number} - #{$gutter});
width: calc(100% * 1 / #{$number} - #{$gutter} - .01px);
margin-left: $gutter;
}
@ -35,25 +35,25 @@
// example : .grid-perso { @include grid(12); }
@mixin grid($number:$number,$gutter:$gutter) {
& > * {
width: calc(100% * 1 / #{$number} - #{$gutter});
width: calc(100% * 1 / #{$number} - #{$gutter} - .01px);
}
& > .#{$kna-namespace}flex-item-double {
width: calc(100% * 2 / #{$number} - #{$gutter});
}
@media (min-width: ($tiny-screen + 1)) and (max-width: $small-screen) {
& > * {
width: calc(100% * 1 / 2 - #{$gutter});
width: calc(100% * 1 / 2 - #{$gutter} - .01px);
}
& > .#{$kna-namespace}flex-item-double {
width: calc(100% - #{$gutter});
width: calc(100% - #{$gutter} - .01px);
}
}
@media (max-width: $tiny-screen) {
& > * {
width: calc(100% - #{$gutter});
width: calc(100% - #{$gutter} - .01px);
}
& > .#{$kna-namespace}flex-item-double {
width: calc(100% - #{$gutter});
width: calc(100% - #{$gutter} - .01px);
}
}
}