PDA

View Full Version : Cant get my div wrapper to center in Firefox...


markthedoc
09-15-2006, 12:29 AM
Hi

I'm having trouble centring Div wrappers. Them seem to work ok in IE but stay on the left in Firefox. I've tried the method as recommended by Mike Crone on this site, but can't seem to get it to work.
I'm sure I'm just missing something. Here's my code:
Any help gratefully received. :wink:


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="hello.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="wrapper">
<div id="header">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="779" height="100">
<param name="movie" value="aurorabanner2.swf" />
<param name="quality" value="high" />
<embed src="aurorabanner2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="779" height="100"></embed>
</object>
</div>
</div>
</body>
</html>

CSS:


#header {
height: 100px;
width: 779px;
}
body {
margin: 0px;
text-align: center;
min-width: 770px;
}
.wrapper {
margin-right: auto;
margin-left: auto;
text-align: left;
}

Creative Insanity
09-15-2006, 12:53 AM
.wrapper {
margin-right: auto;
margin-left: auto;
text-align: left;
}

wrong.. this way.

#wrapper {
margin:0 auto;
}

Leave the text settings for the content selector.
A wrapper is not a class.. it should be set as an advanced selector.
Which means it can only be used once in a document.

markthedoc
09-15-2006, 01:35 AM
Cheers for the tip, that's got it. :wink:

Creative Insanity
09-15-2006, 05:00 AM
The correct wrapper has a width as well.
#wrapper {
margin:0 auto;
width:760px;
}