Vermeiden Spanne-Spalte rechten Rand setzen für: last-child

Question

die HTML Gegeben:

<div class="parent"> 
    <div class="element"></div> 
    <div class="other"></div> 
</div> 

Und das Sass:

.parent { 
    .element { 
     @include span-columns(2.5 of 8); 
    } 
} 

Er erzeugt die CSS:

.parent .element { 
    float: left; 
    display: block; 
    margin-right: 3.22581%; 
    width: 29.03226%; 
} 

.parent .element:last-child { 
    margin-right: 0; 
} 

Der Teil mit :last-child stört mich, weil er die erste Regel mit right-margin überschreibt, die ich behalten möchte. Wie verhindere ich, dass Neat die Regel :last-child hinzufügt? Oder welche Problemumgehung sollte ich machen, um meinen gewünschten rechten Rand zu setzen?

Answer 1

Ich denke, du bist hier in Ordnung. Neats span-columns() mixin erstellt ein Element als Spalte mit den oben kopierten Klassen, einschließlich des rechten Rands für einen Zwischenspeicher zwischen den Spalten. Es verwendet dann die :last-child Pseudo-Klasse, um den Gutter-Rand in der letzten Spalte zu entfernen, so dass Sie dort nicht unnötigen Speicherplatz haben.

Denken Sie daran, die .element div in Ihrem Beispiel ist nicht die :last-child, so dass bestimmte divs rechten Rand unberührt bleibt. Ich warf das in einen JSBin, um Ihnen zu zeigen: http://jsbin.com/wawopef/edit?html,css,output. Ich machte .other eine Spalte auch, da es klar schien, dass Sie dafür bestimmt waren, eins zu sein. Die .element Div hat immer noch ihren Rand, dann.

Wenn Sie wirklich die Regel überschreiben wollten, könnten Sie dies tun, indem Sie das Mixin umschreiben, aber A) das ist wahrscheinlich nicht das, was Sie tun möchten, und B) dies ist Teil des Grid-Frameworks einer anderen Person. Wenn wir ihrer Dokumentation folgen, sollte es gut funktionieren. Oder der Rahmen ist schlecht, was zum Glück Bourbon und Neat nicht sind!