To jest coś, co nigdy nie rozumiałem w Susy 2.
Patrząc na tym prostym przykładzie:
http://codepen.io/itsthomas/pen/Btzxa
HTML:
<div id="wrapper">
<div id="content">
<div class="box1">Box1</div>
<div class="box1">Box1</div>
<div class="box1">Box1</div>
</div>
<aside>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae.</p>
</aside>
</div>
SASS:
@import 'susy';
@include border-box-sizing;
$susy: (
container: 90%,
columns: 24,
gutters: 1/3,
/* global-box-sizing: border-box, */
debug: (
image: show,
output: overlay,
),
);
#wrapper {
@include container;
}
#content {
@include span(18 first);
background-color: red;
height: 100px;
padding: gutter();
}
aside {
@include span(6 last);
background-color: #F0A754;
padding: gutter();
}
.box1 {
@include span(6 of 18);
height: 40px;
background-color: #6D4214;
&:last-child {
/* margin-right: 0; */
@include last;
}
}
że dodanie global-box-zaklejania: niczego border-box, na mapie $ Susy nie zmienia w ogóle, niezależnie od tego czy @include border-box użyć -sizing; w twoim kodzie, czy nie.
Ustawienie $ susy globalnego rozmiaru pudełka wydaje mi się całkowicie bezużyteczne. Czy mogę coś przeoczyć?
Dzięki
Dziękuję za odpowiedź Ale moim zdaniem, tak jak w powyższym przykładzie, jeśli nie używasz ramki-ramki-s w całym wymiarze, zmieniając jedynie globalne globalne ustawienie globalnego rozmiaru skrzyni na obramowanie, ustawienie nie ma nic wspólnego. To znaczy, że jeśli zmiana rozmiaru globalnej skrzynki w mapie $ susy niczego nie zmienia, to dlaczego? – HomTom
Zobacz zaktualizowane wyjaśnienie ... –
Dzięki za wyjaśnienie. To doprowadzało mnie do szału przez kilka dni :) – Ketan