CODEWITHSUNDEEP
csshtmlbackgroundgridfluid-layout
user3232801
user3232801

Reputation: 113

Full width div background color inside a fluid grid layout

I am trying to create a div that is inside a fluid grid layout that has a background color that stretches across the entire width of the page but still holds content, like the dark blue and light blue sections of https://unroll.me/

Upvotes: 0

Views: 2001

Answers (2)

parkeragee
parkeragee

Reputation: 313

First of all you will need to create a div for the blue background. Then you will need to create a div inside of the blue background div to hold your content.

<div id="blueBackground">

    <div id="contentDiv">

      <!-- your content here -->

    </div>

</div>

Next you will style the div's with CSS

#blueBackground {
    background:#hexcolor;
    width:100%;
    padding: 40px 15px; /* first number sets vertical padding - second sets horizontal */
}

#contentDiv {
   width: 100%;
}

Upvotes: 1

bjb568
bjb568

Reputation: 11488

#mydiv {
    width: 100%;
    background: blue;
}

Upvotes: 1

Related Questions