CSS Layout Issues — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

CSS Layout Issues

This page's ID: 11032

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Hmm, did your friend say which browser she was using? This is what I'm seeing in [b][url=http://omnizero.home.comcast.net/asylum/screens/krets/ie6.gif]IE6[/url][/b] and [b][url=http://omnizero.home.comcast.net/asylum/screens/krets/fb06.gif]Firebird[/url][/b], and I'm not seeing the problematic area. Your first step to clean CSS should be the [b][url=http://jigsaw.w3.org/css-validator/validator-uri.html]validator[/url][/b]. (Your only problem right now seems to be the proprietary scrollbar code you're using for IE.) Now for a look into your CSS... For you #content, #head, and #right, I'm seeing some of this (simplified for the sake of clarity): [code] #right { ... padding: 10px 10px 0px 10px; width: 120px; voice-family: "\"}\""; voice-family: inherit; } [/code] I understand the voice-family is part of the IE5 box model hack, but right now it's not doing anything. The whole point of the hack is that IE5 trips over the voice-family code and fails to read any rules following it. As it is, you don't [i]have[/i] any rules after it, so it's not doing anything. If you're unfamiliar with IE5 box model hack works, check the [b][url=http://faq.ozoneasylum.com/1316]FAQ[/url][/b] The correct code [i]should[/i] look like this: [code] #right { ... padding: 10px 10px 0px 10px; width: 140px; voice-family: "\"}\""; voice-family: inherit; width: 120px; } html>body #right { width: 120px; } [/code] Why? Because you have 10px of padding to the left and right of the div. You add this padding to the 120px width, and you get 140px, which is the value you give IE5 because of it's incorrect box model. The html>body area is a piece of code known as the "Be Nice to Opera 5 Rule." Basically, Opera 5 trips over the same "voice-family" code but gets the box model right. So you use this special selector to give Opera 5 the correct value. Everybody wins. Now that I think of it, I think this is what's causing the problem. Your friend is most likely using IE5. Anyways, hope this helps. [img]http://omnizero.home.comcast.net/asylum/sigs/002.gif[/img] [This message has been edited by ozphactor (edited 09-15-2003).] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu