Forum Moderators: not2easy
Seriously, my website is almost complete, less some content of course, except for this tricky little bug that makes things look different between NS and IE.
If you want to rant with me this is the post to do it! Otherwise, thanks in advance for any suggestions.
This is the website [bertelsen.ca].
I'm using Mozilla Firebird 0.7 and IE 6.0.blah.blah.blah to test the view.
Furthermore, I can't find a way to force Mozilla to NOT make my #menu overrun my #main div. I want to force the user to see the site as I have built it, I care little what thier resolution is.
Regards,
1beb
Quick Breakdown of CSS [bertelsen.ca].
div#total - width set, padding ( meant to be whole page )
... argh... The problem is when people view my website with a rez smaller than 1024x768 the #menu element clips runs over top of the #main element. Unfortunately if you notice I have a flash animation as a header on my main page and this causes some clipping of the #menu element when the size is reduced... and I plan on adding such headers to all the pages on the site in it's entirety.
Any suggestions are welcome... Once again thanks in advance to the people that are peeking in and looking at the problem. ( Wholly refferals from this page to my site Batman! )
repeating info in case above posts are deleted...
it seems that mozilla browsers read relative positioning backwards with respect to IE for example, a relatively positioned element that is set as left:15px; is read from the right of the element in the opposite browser because the two browsers take different standpoints over which one is relative to the other...
... argh... The problem is when people view my website with a rez smaller than 1024x768 the #menu element clips runs over top of the #main element. Unfortunately if you notice I have a flash animation as a header on my main page and this causes some clipping of the #menu element when the size is reduced... and I plan on adding such headers to all the pages on the site in it's entirety.
#total{
width:940px;
padding:20px;
background-color:#000033
}
#main{
border:1px solid #FFFFFF;
width:620px;
background-color:#000000;
font-family:verdana;
font-size:12px;
color:white;
padding:10px;
}
#menu{
border:1px solid #FFFFFF;
position:relative;
left:0px;
float:right;
width:250px;
padding:10px;
background-color:#333333;
font-family:verdana;
font-size:12px;
color:white; where my page layout is as follows
<div #total>
<div #menu>...</div>
<div #main>...</div>
</div> EDIT:
omg I'm such an "..." ( another word for donkey )
setting the #total element to static works like a charm
position:static; Thanks to another person's post that made me ACTUALLY think about it!
Regards,
1beb