RE: Using CSS to replace tables for positioning

At 10:27 30/03/02 +1200, Richard Lake wrote:
<snip/>
>O6 places a 5px margin around the logo div, causing the navi div, which is
>postion absolute, to be 5px too high - not too big a deal, but not nice.

Try putting an explicit margin around the logo div.

You could also try something like:

<.div id="logo">Logo in here</div>
<.div id="main">
   <.div id="content">Content</div>
   <.div id="navi">Navigation</div>
</div>
<.div id="footer">Footer</div>

Then in the CSS:

div#main {position: relative}

div#content {width: 80%}

div#navi {position: absolute; left: 80%; width 20%}

This would then mean that everything would move down if the logo expanded 
for whatever reason.

If you can't work out what I'm on about, give me a shout and I'll explain 
better tomorrow :-)

>IE6 has the "buttons" moving around as you hover, the only way I've been
>able to stop this is to set all 4 margins on the "buttons" to be equal, but
>that causes the navi to be too low in relation to the content.

What happens if you set the margins, widths height and padding in the #navi 
a and #navi a:hover rules? It looks like IE 6 isn't inheriting something 
properly.

Normally I'd experiment with these myself, but its late at night, and I've 
been moving furniture and books all day. My study is rather cramped with 
both at the moment, and I'm tired :-)

Any probs, let me know and I'll work on it tomorrow.

Andrew

--
http://aamcf.co.uk/

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA