CSS Problems

[PRSBOY]

http://www.ircyou.com/website.php

that page renders fine in IE, centered, padding all correct etc. but in Fire Fox the page is not the same, some parts i've fixed but the rest has me puzzled.

Any help would be apreciated.

 

[sugoi]

try adding this in the #wrapper:

margin:auto;

 

[PRSBOY]

try adding this in the #wrapper:

margin:auto;

thanks, that sorted the page align, now i just need to sort out the padding and margins within the inner div.

 

[Al Vallario]

Have a look at the Holly hack.

Internet explorer counts padding as an addition to the width of an element, whereas Firefox doesn't adjust the width when padding is applied - the correct method according to the W3C. Therefore, if you have an element with a set width of 200px, and 20px padding, you would use the following code:

#element {
  width: 200px; /* All browsers can see this */
  padding: 20px;
}

* html #element {
  width: 160px; /* Only Internet Explorer recognises this */
}

av.

 

[Augmented]

[snip]

Sorry, got to pick up on a couple of inaccuracies there .

The Holly Hack traditionally involves passing an element height: 1%; in order that it obtains layout [hasLayout] to fix IE's issue with non-positioned or non-dimensioned boxes. * html #element is the "star-html hack", or such, that exploits a bug in IE's CSS parser to allow for IE-only rule sets. They're two different things. * html can be used in the Holly Hack, but it's not the actual 'hack' itself.

Additionally, the issues where "Internet explorer counts padding as an addition to the width of an element" applies only to IE5 and IE6 in quirks mode. The box model was fixed in IE6. The link in the OP will trigger standards-mode in IE6, and so shouldn't need any correction.

 

[PRSBOY]

well, its seem to have worked perfectly for me..

www.ircyou.com/website.php

test in IE and Fire Fox for me please.

 

[sunlitsix]

looks the same in firefox and IE7