padding problem in Opera 5,6 and Mozilla 1.6

i wrote:
<DIV style="position:absolute; top:-5px; left:0px; width:60px; background-color:#000000;"></DIV>
<DIV style="position:absolute; right:0px; width:90px; background-color:#000000;"></DIV>
my intension here is2create a top web-page header without horizonal scroll-bar; completely black!
this valid works fine with only MSIE.

see also:
<DIV style="position:absolute; left:0px; padding-left:50px; width:760px;"></DIV>
what would u expect ?
simply a box of width:760x; and padding-left:50px; with no horizontal scroll-bar.
but, Opera 5, 6 and Mozilla 1.6 create a box of 760px+50px width.

In both cases MSIE behaves well! why ? and what should i do2tame Opera -n- Mozilla ? thanx2those who'll solve my trouble.

__________________
`~@#\^%&*/\.<.\/-|+|_!:;..=?>
PHP, SEO | anshul shrivastava | mediasworks.org | FB

You shouldn't do anything to tame Opera and Moz because they ain't broken. IEWin versions prior to 6 and version 6 in Quirks Mode are.

'width' refers to the content width. Padding and borders are added to that width. Read this page:
http://www.w3.org/TR/REC-CSS2/box.html
Then go here to review a vast array of hacks to fix IE.
http://css-discuss.incutio.com/?page=BoxModelHack

(o<
//\ =^..^=

One of the best things you can ever do for your IE visitors, IMO, is to use IE7. It isn't actually the next version of Internet Explorer, but it's probably better than the real IE7 will be :-)

IE7 helps IE support standards.

http://dean.edwards.name/IE7/intro

HTH,

Snib

<><

Well, I doubt this is covered by "IE7" since IE6 does get it right if you don't put it in Quirks Mode. Even if it is, isn't loading a large javascript library a little overkill when all it takes is a few extra bytes in the style sheet?

(o<
//\ =^..^=

Actually, the page I linked to says straight-out that Dean has conquered the box-model, although I haven't tested it.

As for loading a lot of JavaScript, it's commonly worth it, IMHO, for how much easier it makes coding for different browsers. It only takes a few seconds even on my 7-year-old computer.

Anyway, that's just my input.

Snib

<><

One common technique to get around the differences in IE quirks interpretation of the box model as well as IE 5, and 5.5, is to always use margins instead of padding. Though sometimes that requires more markup, and sometimes collapsing margins require that a border also be specified.

As far as IE7, the great thing about IE7 is it only gets served to Explorer browsers through IE proprietary conditional comments. It also gets cached, so it doesn't have to download every time. Dean also modularized the various fixes, so if all of the fixes are too much, you can just comment out the parts of the script that load the extra modules. Here's a thread that discusses this further:

https://sourceforge.net/forum/forum....orum_id=379297

He's talking about only needing PNG transparency in that thread, but the idea can be applied to any of the modules.

The thing that I like about IE7 most, is I can use completely standard CSS, without putting in extra markup (structural changes), or use of bug exploits from within CSS. I've also noticed that IE7 helps with bugs like the pick-a-boo bug, in some cases.

I guess it just boils down to which hack appeals to you most ;).

Also keep in mind that IE7 is still alpha and not recommended for live sites. Personally I've had nothing but good luck with it.

Regards,
Rich

::::::::::::::::::::::::::::::::::::::::::
The Spicy Peanut Project
http://www.spicypeanut.net
::::::::::::::::::::::::::::::::::::::::::