User Comments

Very slick!

I don’t think frames are always bad - they can be useful on web applications, where sometimes the ability to bookmark individual pages is undesired behavior anyway, and where you don’t have to worry about search engine results (e.g. applications on an intranet).

But for normal run-of-the-mill web sites, this is a great effect.

The great thing about frameset emulation is that the negatives of the frameset (inability to bookmark, search engine interference, printing problems, etc, etc) do not apply. I like this because it also degrades gracefully and I can “de-frame” an entire site just tweaking a couple of lines of CSS!

That’s totally cool.

Just as an additional info: you can make it work in IE6. I used it on my site.

That’s good to know Luc. I’ll check out your source and CSS if that’s okay so that I can tweak this example to work in IE?

It may be worth noting that this frameset does not work correctly in IE 5.2 for Mac, in fact most of Urban Mainframe is displayed incorrectly in IE 5.2 for Mac.

I know Frank. I’m sorry. However, this website is coded correctly (to XHTML 1.0 transitional). IE 5.2 (Mac) is not!

That sounds harsh, but it’s true. I have created these standards-compliant pages with a view to the future, not for legacy browsers. I have had to use enough “hacks” to get the site to display correctly in IE6, so I’m afaid I’m not prepared to taint it further by adding hacks for a deprecated web browser - a browser that, according to my stats, accounts for a mere 0.13% of the web-clients I have to cater for.

I hope that you have access to another web-browser Frank. If not, I apologise for my “broken” website, all I can do is change my CSS so that the styles are omitted for older, non-compliant browsers.

How about Safari (1.0.2) though, there seems to be some problem with perhaps a block element. The black bar which indicates which page you are on, obstructs part of the word. When you rollover any of the other sections of your website the black bar jumps up and down.

Lynne that behaviour is definitely not what I intended. What should happen is that blue bar should appear UNDER the menu item on hover. A black bar should appear under a menu item that is in the current path.

I have noticed a glitch in IE6 in that the hover bar appears under the black bar where there is a link - this is also not correct, but I have, as yet, been unable to resolve it.

The behaviour in Safari sounds like a serious glitch. I’ll look into this and ask around but, unfortunately I don’t have access to Safari to test this.

I will do my best to make the website usable for all. Please bear with me.

Sure, DarkBlue… ripp the code apart dude :-) I must warn you, although the principle looks easy, it can be extremely tricky to do depending on your layout.

Cheers Luc. I’ll give it a go. Watch this space…

Site looks great on Camino 0.8b ! Awesome tip. I’m going to implement this in a webpage of mine and hopefully a message view for AdiumX.

I’m glad it is useful for you Forrest. Have fun.

Boocoo thx darkblue for the tip. I'm on FireFox 1.5 and it works beautifully.

I'm your basic N00B with web page design. Have my own site validated W3C for XTML Transitional and CSS. Figured out the frames thing and the CSS thing, but been having fits on how to put them together. With everything I've read on how crappy frames are, I had decided to leave my site as is. But it is great to find a CSS hack.

NOTE: This comment has been edited by its author! Additions are shown in italics, deletions with a strike-through.

This code might make it work in IE. I think it’s from Andreas Viklund but I’m not sure where I got it. I know it works with a fixed sidebar.

Bob Ray

This goes in .html file right AFTER the reference to your css file. It should appear just as written here:

Contents of file: fix.css:

/**** IE fixes ****/

html {overflow:hidden;}

body {height:100%; width:100%; overflow:auto;}

PS: In Opera 8.52, the advertisments stay on top of the purple header bar, although maybe that’s what you intended.

Also, the “comments” links are the same color as the rest of the text unless you hover over them.

Bob