Internet Explorer the root of all evil!

**drhowarddrfine** · Apr 14 '08, 03:19 PM

Validate for your list of xhtml errors that need fixing.

IE screws up font sizes set with small-large-etc. To get IE into line, in the body set 'font-size:100%'.

See what happens then.

**Death Slaught** · Apr 14 '08, 07:53 PM

What?!?!?! My code doesn't have any errors, at least the copy of it I have doesn't. Surely you wouldn't assume that me of all people would omit the end tag for the title elements, and anchors? My end tags were quite rudely ripped off of my code when it was being posted...

I'll be sure to try that, and Thanks, Death

**Death Slaught** · Apr 14 '08, 08:09 PM

I tried it and nothing. Just out of curiousity, how can font size cause something like this, and this? When it's supposed to look like this (I'm still working on the images for the links, incase you were wondering why they look so crapy).

Thanks, Death

**drhowarddrfine** · Apr 14 '08, 09:14 PM

Originally posted by Death Slaught

Just out of curiousity, how can font size cause something like

I'm just sayin'....

I didn't put an image in so it might have something to do with that. I'll try and look in a bit.

EDIT: On second thought, the problem was there before and I didn't see it.

**Death Slaught** · Apr 14 '08, 09:26 PM

Thanks, I've never seen anything like this before, and it confuzzles me.

Here's an interesting thought. When I reduce the navagation divisions width to 1px, the anchors are perfectly centered and it doesn't affect it cross browser. However, the gap is still there and that messes up my top navagation aswell.

Thanks, Death

EDIT : If you want the actual file, images and all, let me know.

**drhowarddrfine** · Apr 15 '08, 04:06 PM

I'm floating around today and don't have access to Windows. I couldn't immediately see what the heck IE was doing. Maybe later tonight.

**Death Slaught** · Apr 15 '08, 07:48 PM

It's fine take you time, I'm not really in a rush to get it figured out.

Thanks, Death

**Plater** · Apr 15 '08, 08:29 PM

How about this:
(NOTE: I threw in some horrible background colors so you could see just where your DIVs were, you can remove them)
[code=css]
* {
margin:0;
padding:0;
}

body {
background-color:#000;
background-image: url('Images/main-background.jpg' );
font-size:small;
margin-top:30px;
margin-bottom:30px;
}

div#tgnav {
width:100%;
text-align:center;
position: absolute;
top:5px;
left:0px;
color:#E00000;
}

div#tgnav a {
color:#FFF;
font-size:16px;
}

div#wrapper {
background-color:green;
text-align:center;
width:600px;
margin:0 auto;
overflow:auto;

left:0px;
background-image: url('Images/Background2.png ');
}

div#wrapper div#top {
text-align:center;
width:600px;
height:auto;
left:0px;
background-color:yellow;
}

div#wrapper div#top img#logo {
vertical-align:bottom;
}

div#navagation {

width:600px;
height:auto;
text-align:center;

background-color:red;
padding-top:0.3em;
padding-bottom:0.3em;
}

div#wrapper div#top div#navagation ul {
width:600px;
list-style-type:none;
position:absolu te;
top:154px;
padding-top:0.3em;
padding-bottom:0.3em;
}

div#wrapper div#top div#navagation li {
display:inline;
}

div#wrapper div#top div#navagation a {
text-decoration:none ;
padding:0.2em 0.8em;
font-size:15px;
color:#800080;
border:1px solid #FFF;
}

div#wrapper div#contents {
width:600px;
height:500px;
}
[/code]

If i understood your layout correctly, the logo IMG will push the navigation div down on it's own, so need to make that DIV position: absolute. I also threw in a left:0px to make that upper nav bar center correctly.

**Death Slaught** · Apr 15 '08, 08:43 PM

lol, you have no idea how funny it makes the layout look with those divisions (of course the images are added when I view it).

I want the navagation to be ontop of the image that's why it's positioned absolutely. Thanks for trying though.

Thanks, Death

**Plater** · Apr 15 '08, 08:49 PM

If you want it on top, use Z-Index, that's what it's there for?
Your FF image didn't have it on top, so I didn't check for that.

**Death Slaught** · Apr 15 '08, 08:56 PM

It was an Opera image, and when I say on top. I meen that it was on top of the bottom part of the image. That's why the navagation division was positioned absolutely and had a set top.

Thanks, Death

**Plater** · Apr 15 '08, 09:00 PM

Ok, well for some reason IE doesn't recognize that the navigation div was contained withen other DIVs and was offsetting from the normal flow (or rather the body element instead of the div#top)
Just need to continue playing around with it.
I would say when in doubt, include everything. Such as putting "left: 0px" or specifically assigning values to anything you might not think are needed.
That helps settle differences between IE and FF

**Death Slaught** · Apr 15 '08, 09:07 PM

Thanks, I'll have some free time soon and I plan on ripping my code to pieces and then putting it back to gether making sure about every little detail.

Thanks, Death

Internet Explorer the root of all evil!

Internet Explorer the root of all evil!

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment