Hatrack River Forum: Sometimes I wish I could make IE6 Disappear. (Need CSS help)

This is topic Sometimes I wish I could make IE6 Disappear. (Need CSS help) in forum Books, Films, Food and Culture at Hatrack River Forum.

To visit this topic, use this URL:
http://www.hatrack.com/ubb/main/ultimatebb.php?ubb=get_topic;f=2;t=048012

Posted by Boris (Member # 6935) on :

As I've mentioned, one of my new job duties in my new job in Alaska is to re-design the company web page. The current page located here is horribly out of date and quite ugly by today's standards. I've been working in Dreamweaver for the re-design (mostly as a see it as I code it solution, since I seem to enjoy coding things more than not). In my previews of the new page (which is located here for test purposes before being fully published) Firefox displays the page exactly the way I want it to. The same with all the Mac browsers I have available. Safari does sometimes come up with a weird problem, likely related to the fact that I'm making use of an iframe tag to handle most of the page content, but I think I have that solved (It doesn't seem to like having CSS applied to an iframe tag, which I removed since I didn't need it).

I should probably mention that this *is* my first attempt at table-less design using CSS, and I am kinda cheating by using an iframe tag, but it is extremely useful in this particular application. And I also realize that my CSS is something of a mess. I'm working on that [Big Grin]

The big problems come when I try to load the page in IE6. Imagine that. One problem still seems to involve the rendering of the iframe, and IE's inability to deal with CSS :hover (if anyone knows how I can have the same affect without using :hover, that'd be great). When you hover over a link on the navigation bar and then move the cursor into the iframe area, the :hover element doesn't quit it's job, and the link stays highlighted. Not a huge problem, but still annoying. Even does it in IE7.

The other issue happens whenever you disable javascript. I'm using a simple javascript to control the left side, outside link navigation bar. My boss suggested I compress all the links so a user has to click on the caption to view its contents. After a lot of research, I settled on what I've got. The script works fine, and everything renders properly (With the single exception of an extra line before the links that Firefox doesn't render, which is apparently being caused by a <ul> tag, which I can't seem to remove), but only when javascript is enabled. The noscript version of the page causes some weird jumping link issues that I've tried to fix with no success.

Another issue happens when you select text in the iframe. For some reason, IE just kinda gets a little weird for me, and I can't quite explain why.

The final issue occurs when I click on the "contact us" link on the navigation bar. IE decides it needs to render the :hover CSS inside the iframe, at 1/3 and 2/3 of the page's length. I cannot even think of what's causing that.

At any rate, if anyone has any knowledge of these issues or how to fix/get around them, I'd really appreciate some help. I've been trying to fix this for...well, about a month now.

Posted by TomDavidson (Member # 124) on :

Honestly? I wouldn't use an iframe, and I probably WOULD use a table. [Frown]

Posted by Boris (Member # 6935) on :

Well, I was that way til I figured out how to control everything with CSS, and MAN is it powerful. Except that IE is stupid and can't handle it.

As far as the iframe goes, I like being able to keep the navigation parts of the site separate from the actual information. I couldn't figure out a way to do it without using an iframe.

edit: I just realized...maybe there should be a CSS command to implement the thread title. Something like:
ie6{display:none}
That would rock [Big Grin]

[ March 23, 2007, 05:24 PM: Message edited by: Boris ]

Posted by Chris Bridges (Member # 1138) on :

A server-side include, maybe?

We use iframes, but only for elements on our page that are drawn from other sites. Too much of an annoyance when their site goes down and our pages spend long minutes figuring that out...

I tried a total CSS design for our latest redesign and gave up in despair of getting a three-column layout to look the same in all browsers, so I settled for a basic table to separate the columns and left everything else CSS.

Posted by Boris (Member # 6935) on :

SSI is probably not so good for this setup. In part because I have no idea what it is or does [Big Grin]

The other part is our server. We provide domain and webspace service to a number of small companies around here. As a result, we've separated active content from non-active content to decrease security holes (the old web server was hacked through PHP numerous times). The new server has no server-side dynamic capabilities installed in it. We have a third party active web space that we use for CGI, PHP, and MySQL stuff, but it'd be a little tough to use it for a full web page.

Posted by Chris Bridges (Member # 1138) on :

Server side includes are nothing more than text files that you can embed into a page. Make a file called menu.inc, put your menu code in it, and then add

code:

<!--#include virtual="/menu.inc"-->

to any webpage you want that code to appear on (edit the link to refelct the actual location). Change that file, all your pages change.

You can enable SSI support for individual folders, either with the server software or by placing an .htaccess file in the folder with SSI specifications added.

Posted by Abhi (Member # 9142) on :

well, i do a lot of CSS stuff, and i prefer to use css exclusively no tables or "iframes"... instead of using hover in CSS, you could use DHTML or javascript to do the same.

most of our pages require "stitching" for dynamic content, and using CSS helps cut down on development time, since the engineers can work independently, and I can change design elements anywhere in the page without the page requiring re-stitching.

Posted by Abhi (Member # 9142) on :

Ok, i just had a look at your test site... there's really no reason to use iframes here or the fancy drop down menu's you're using currently [though that can be done in CSS too if you really want to].

I would really recommend also reconsidering the color scheme. It matches your logo, but you want something a little more reader friendly and bright. I always recommend using a white or light gray background instead of black as that brightens up the page considerably [unless you're going emo :)]