How to make full background color in skeleton, responsive 960 grid?

3.7k Views Asked by At

I am trying to achieve full background width, using skeleton framework. For now, bad luck.

Here's how it looks now : http://shrani.si/f/3A/Uy/28somHnh/capture.png

Thanks everyone for helping me.

<div class="container"> 
<div id="portfolio-color">

<div class="sixteen columns">
<div id="color">
<div class="five columns offset-by-four">LATEST WORK



</div>
    </div>
</div>
</div>

 </div>
1

There are 1 best solutions below

0
On

You can do so by putting .container onto a full width wrapping element. Something like this:

See dabblet here http://dabblet.com/gist/6476534

<style>
    @import url(import.skeleton.before.css)
    .wrapper {width: 100%;}
    .color-one {background-color: red;}
    .color-two {background-color: green;}
</stlye>

<div class="wrapper color-one">
    <div class="container">
        <div class="sixteen columns"></div>
    </div>
</div>

<div class="wrapper color-two">
    <div class="container">
        <div class="five columns offset-by-four"></div>
        <div class="eleven columns"></div>
    </div>
</div>