html - How do I divide the Skeleton CSS boilerplate into 5 columns? -
i start skeleton css boilerplate http://getskeleton.com/ it's first time have designed , scripted 960gs template, , totally don't it.
according few tutorials, understand width of page consists of 16 column units. example, can divide page ten-unit column , six-unit column:
i took following code straight away skeleton layout.css:
/* base grid */ .container .one.column, .container .one.columns { width: 40px; } .container .two.columns { width: 100px; } .container .three.columns { width: 160px; } .container .four.columns { width: 220px; } .container .five.columns { width: 280px; } .container .six.columns { width: 340px; } .container .seven.columns { width: 400px; } .container .eight.columns { width: 460px; } .container .nine.columns { width: 520px; } .container .ten.columns { width: 580px; } .container .eleven.columns { width: 640px; } .container .twelve.columns { width: 700px; } .container .thirteen.columns { width: 760px; } .container .fourteen.columns { width: 820px; } .container .fifteen.columns { width: 880px; } .container .sixteen.columns { width: 940px; } .container .one-third.column { width: 300px; } .container .two-thirds.column { width: 620px; }
the problem divide page 5 parts (with margin, of course)... how? use 3 columns 5 times, count total of 15 columns. there way this?
these best tutorial series skeleton have found. helped me: https://www.youtube.com/watch?v=qfyksqbvcas
however, if go skeleton homepage there grid system demo on there. inspect source, gives you:
<div class="five columns alpha">five</div>
hope helps :)
Comments
Post a Comment