CSS broken in Opera & Firefox 1

[ClulessChris]

I'm very new to CSS but am trying hard.
The following short CSS works in IE7 but the 2 main DIV's (Content and navbar) don't align when displayed in Opera Or Firefox.
Can you tell me why?

body{
	font-family: Helvetica, Arial, Sans-Serif;
	}

h1, h2, h3, h4, h5, h6{
	color: teal;
	margin: auto;
	}

p.headline{
	Color: "#FF0000";
	font-weight: 700;
	font-size: 1.4em;
	}

#wrapper{
	Position: absolute left: 2%; Top: 0;
	width: 100%;
	Padding: 10px;
	}
	
#header{
	Position: relative;
	height: 110px;
	width: 100%;
	margin: 0 auto;
	background-color: #FFFFFF;
	}

	
#navBar{
	float: left;
	width: 20%;
	Top: 30px;
	padding: 25px 5px 25px 5px;
	border: 1px solid black;
	font-size: .95em;
	background-color: #ffcc66
	}

#content{
	float: left;
	Top; 30px;
	width: 80%;
	padding: 25px 0 0 25px;
	border: none;
	font-size: 1em;
	}

#RightImg{
	float: right;
	boarder: none;
	height: 240; 
	width: 175; 
	border: 0; 
	}

#layer1{
	background-color : #FFCC66; 
   	layer-background-color : #FFCC66;
   	border-width : 1px; 
   	border-style : solid; 
   	border-color : #006666; 
	padding: 5px;
   	width : 150px; 
   	top : 210px; 
   	left : 150px; 
   	position : absolute; 
   	z-index : 90; 
   	visibility : hidden; 
	}

Never knock on Death's door: ring the bell and run away! Death really hates that!

 

[BabyJeffy]

Validate your CSS and then see how you go. You have missing semi-colons (at the very least). No point trying to trouble-shoot when the code is not valid in the first place

http://jigsaw.w3.org/css-validator/

Cheers,
Jeff

[tt]Jeff's Blog [!]@[/!] CodeRambler

http://www.coderambler.com/

http://www.coedit.co.uk/

[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094

 

[ClulessChris]

Thanks for the tip.

I figured this one. was due to the content div being too wide. I set to 76% an bingo!

Never knock on Death's door: ring the bell and run away! Death really hates that!

 

[BillyRayPreachersSon]

But your CSS is still invalid, and you should still correct it regardless of whether you've fixed your original issue or not.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[ClulessChris]

Dan,

Where is the above posted css invalid?
I can see the missing semi-colons at the last attribute of the navBar div, but (although this is a mistake on my part) I thought this was optional.

This is my first step in to the muddy waters of css and any tips on where I'm going wrong are gratefully received.

Never knock on Death's door: ring the bell and run away! Death really hates that!

 

[BillyRayPreachersSon]

Here's one that jumps out immediately:

Position: absolute left: 2%; Top: 0;

Note the missing ";" after "absolute".

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]