View Full Version : Problem: Fixed DIVs in IE or Float Clearing?

03-15-2005, 05:53 AM
I really hate asking for things that I'm sure are simple enough to figure out on my own. i have looked over things way too many times tonight and I'm not sure why what is going on is going on.

the page (http://home.earthlink.net/~harbingerofthevoid/)

the CSS (http://home.earthlink.net/~harbingerofthevoid/css/normal.css)

the IE CSS (http://home.earthlink.net/~harbingerofthevoid/css/ie.css)

There are different CSS files for IE due to the filter property of the png and some minor positioning issues.

Here is the deal.

I fixed the DIVs in IE. Everything works fine sort of. At first glance you'll notice the content of the the IE is situated under the navigation. I can fix this with a negative margin for IE. The content is floated to get aroung the DIV "fixing" in IE. I had thought a simple solution would ber to clear either the nav or the content. Neither works right.

The nav container (#links) is positioned but the inner links are floated for the effect.

If I remove the #links entirely on load IE shows it correctly without the need of a negative margin.

That's my float issue I think.

Then if your on the home page, you can scroll down to the "New Site Additions" part and there is an expand/collapse javascript. In Mozilla when you click it it works fine. In IE, on click, it throws the navigation as well as the cloud up top off the page. The content itself is expanding but it pushes everything else on the page up as well.

A third problem. Yeah I know this is getting long ;)

On Mozilla there is a copyright line at the bottom of the content. In IE it's not there. Still not sure about that one but since I'm writing this I might as well ask.

I'm not even going to ask about why IE doesn't display the png in the Blog section.

Any help is duely appreciated.

03-15-2005, 06:55 AM
quick validator check:

.copyright {
color: #D0D7CA;
font-size: 7pt;
font-variant: small-caps;
text-align: right;
padding: 30px 0 0 0;
margin-bottom: -30px;
float: right;

you had it as a colon :) Could be your IE killer. Seeing as I don't have IE, I can't help you out with that much :)..

Err, scratch that. IE/mac is doing some funky stuff too. I've attached a screenshot. When I have more time I might be able to work a bit of that out. Lovely design by the way. You're doing good things with it. But make the harbinger of the void text more prominent. And get a domain. heh. good luck

03-17-2005, 04:16 AM
I appreciate the once over Jalenack.

I tooled around with it a "fixed" the sidenav jumping issue. The cloud on the top off the page still jumps in IE though. Since it overlays the content div, when said div expands it affects the cloud2.png. Weird but not to worried about it now. Maybe a javascript will be my salvation on this as I can't see a fix with CSS.

Thnaks for the screen shot on IEMac. i only have access to one at work and limited at that so I haven't tackled it yet. The letters in the nav probally should line up now but will still be left justified instead of centered. I'll try throwing <br>'s in there to see if it works.

Anyways, if you see this and have time would you mind giving another mac screen shot so I know where to begin mentally before trying to go in on saturday and trying to fix it?


p.s. the copyright thing. It was the margin set to the line. IE didn't like it. i took it off and unfloated it (since it was unnesecary) and all is good there.