Skeleton framework columns

[mika]

Hi folks,

i’m newbie with Skeleton framework.

I have 8 units of (hexagon elements) “class=”two columns” units (w:100 h:150) in one row. How can i make these units to collapse nicely in tablet and mobile and keep size the same?

now they just stretch one by one full width in mobile.

/ Mika

[jurotek]

You have to write your own class for your hex thing so it is not affected by media queries like class .two.columns

css

.my-hex-thing {width:100px}

html

<div class="container">
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
<div class="my-hex-thing columns"></div>
</div>

[mika]

Thx Jurotek!

Sometimes when you move from “ordinary”

<

div> based design into RWD you forget the very basics.

Now can someone tell how to make sticky bottom footer for Skeleton? :-)

[jurotek]

Here are the basics for sticky footer. html and body height must be 100%. The container which holds sticky footer must have min-height 100% and must be positioned relative. Than your footer must be positioned absolute with bottom and left 0 and must have width of 100%.

[Paulie_D]

Or not…

https://css-tricks.com/snippets/css/sticky-footer/

[Author]

Posts