CODEWITHSUNDEEP
htmlcss
mkHun
mkHun

Reputation: 5921

why the div tag not fit to the top in the body?

My html code is

 <html>
 <body id="body">
 <div id="content">
 <div id="head1">
 <h3 id="cpsir">CPSIR-CM</h3>
 </div>
 </div>
 </html>

Css code is

#body{
background:#0F657D;
}
#content{ 
width:1000px;
height:740px; 
background:#E2E2E2; 
margin-left:auto; 
margin-right:auto;
}
#head1{
width:auto; 
height:60px; 
background:#626262; 
margin-top:-10px;    
}
#cpsir{
font-family:Verdana, Helvetica, sans-serif; font-size:24px; 
color:#F4F4F4; 
padding-top:10px;

}

I'm trying to fit the head div tag to the top of the body. But which is not fit perfectly. So, I'm used the negative px for it., but which result is differ to the different browser. For example, In the torch browser margin-top:-10px gives what i expect , which is change into the Internet Explorer. What can i do?

Upvotes: 0

Views: 207

Answers (2)

Hammerbo
Hammerbo

Reputation: 660

A starter tip i got once when optimizing for different browsers:

*{
margin:0px;
padding:0px;
}

that way all elements are rendered the same in every browser, since IE have one way of putting small margins here and there, as do Firefox, Chrome, etc.

You can just put margins on elements afterwards

Upvotes: 1

Ted
Ted

Reputation: 14937

Start with:

html, body{
    margin:0;
    padding:0;
}

And then you shouldn't need the negative margin on #head1

Upvotes: 1

Related Questions