Forum Moderators: not2easy
When I us H3 in my header section there are no problems. When I use H1 or H2; the position of the header is pushed down and overlaps with the left and right columns.
Here is my CSS:
/* Layout Stylesheet */
body{
margin: 0;
padding:0;
background:#808080;
color: #333333;
}
#lh-col{
position:absolute;
top:202px;
left:0;
width:220px;
z-index:3;
background:#c0c0c0;
color: #333333;}#rh-col{
position:absolute;
top:202px;
right:0;
width:140px;
z-index:2;
background:#c0c0c0;
color: #333333;}
#c-block {
width:100%;
z-index:1;
background:#c0c0c0;
color: #333333;
height:80%;}
#hdr{
height:200px;
border-bottom:1px solid #000000;
width:100%;
background:#eeeeee;
color: #333333;
margin:0;
padding:0;
}
#c-col{
margin:0 142px 0 222px;
position:relative;
background:#ffffff;
color: #333333;
z-index:5;
border: solid #000000;
border-width:0 1px;
}
#ftr {
width:100%;
height:35px;
border: solid #000000;
border-width:1px 0;
background:#eeeeee;
color: #333333;
margin:0;
}
Here is the relevant part of the page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>My Nifty Page Title</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1" />
<meta name="Robots" content="NOINDEX" />
<meta http-equiv="PRAGMA" content="NO-CACHE" />
<link rel="stylesheet" type="text/css"
href="layout.css" />
<link rel="stylesheet" type="text/css"
href="presentation.css" /><!-- header div -->
<div id="hdr"><h1>Feedback Is Reputation... Protect YOURS!</h1></div>
</head>
<body>
<!-- center column -->
I should note that it works fine in IE but FF is where I am having the problem.
<div id="hdr"><h1>Feedback Is Reputation... Protect YOURS!</h1></div>
</head>
<body>
How come your <div> is inside your <head> section?!
I moved the </head> back up above the Div and it did ont change anything. I had started with a template that did not have anything set up for H1,H2,H3. Does not ahving any formatting for the H elements break?
How should I format the H elements?
Go easy on me I am new to CSS.
Chuck
I added this and it shifted back up where it belongs.
THanks for the help!
h1,h2,h4, h3 {
margin:0;
padding: 5px 0;
}
