user3386779
user3386779

Reputation: 7215

how to add css background color for div tag

I want to add background color for div tag.I referred some code but I doesn't help me to add background color.Now the div tag shows blank.I want to add background color in div tag.I dont know what I did wrong.

 html
   <body>
    <div class="main"> 
       <div class="header">
       </div>  <!-- end of header div -->
    </div>      <!-- end of main div  -->
   </body>   
 css
     @charset "utf-8";
     body {
     margin:0;
     padding:0;
     width:100%;
     font:normal 12px/1.5em "Liberation sans", Arial, Helvetica, sans-serif;
    }
    html {
     padding:0;
      margin:0;
    }
   div { width: 100%; }
  .header
    {
    margin:0;
    padding:0;
    width:100%;
    background-color:#15317E;
   }

Upvotes: 0

Views: 389

Answers (6)

Sacreties  J
Sacreties J

Reputation: 21

change background-color as just background

Upvotes: 0

Epiphany
Epiphany

Reputation: 1894

Simplest... add a space as a shim for your header until it has other content.

<div class="header">&nbsp;

Upvotes: 0

Andr&#233;
Andr&#233;

Reputation: 82

It's because nothing is typed in your "Header" div. Once there is text the background will show, at the moment the div is empty.

Upvotes: 1

Ila
Ila

Reputation: 195

You have to have some some contents inside div, else it means empty. You can try

min-height 

in css to always have some minimum height. And its not advisable to give style to div, Use some class for it!

Upvotes: 2

henrily
henrily

Reputation: 236

There's nothing wrong with your code. It's just that your div doesn't have any content so the height is 0, it's normal that you don't see the background-color.

Add in your :

<div class="header">
</div> 

Upvotes: 1

Pa3k.m
Pa3k.m

Reputation: 1166

You have to specify a height for your .header. Unless your div have contents in it, it would automatically be set to 0.

Upvotes: 3

Related Questions