...

View Full Version : CSS Positioning



Blind Zero
02-13-2005, 07:18 AM
I have been reading about CSS positioning and such so I though it I would give it a try. And I was doing fine, until this came up. I have no idea why the navigation bar is above when I think I coded it to be below.

HTML Code

<html>
<head>
<title>Subliminal Prophet</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body>

<div id="header"><img src="images/test.gif" height="100" width="500"></div>
<div id="nav">Hello</div>


</body>
</html>

CSS Code

html, body { background-color: #FFFFFF; color: #000000; margin-left: 0; margin-top: 0; }

#header{ position: absolute; top: 0px left: 0px; background-color: #CCCCCC; color: #000000; text-align: left; width: 100% }
#nav { position: absolute; top: 100px left: 0px; background-color: #336699; color: #FFFFFF; text-align: center; width: 100% }

_Aerospace_Eng_
02-13-2005, 08:59 AM
well its doing what its supposed to, once u use absolute positioning, it takes things out of "flow" so they ignore each other, if you just put the nav div above the header div without using css positioning then the nav would appear above the header without any overlapping

JamieR
02-13-2005, 11:32 AM
well its doing what its supposed to, once u use absolute positioning, it takes things out of "flow" so they ignore each other, if you just put the nav div above the header div without using css positioning then the nav would appear above the header without any overlapping

I made the same mistake recently. I had to bomb all the css and totally re design the site :o

Blind Zero
02-13-2005, 06:05 PM
Ahh, thank you. I took the "absolute" out of both of them and now it works like a charm.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum