Float left, Opera

Posted By Pamela on Aug 1, 2007 | 6 comments

I never cease to be amazed at the differences in website appearances from browser to browser. I’d come up with a web design I didn’t totally like, but I could live with, for Firefox and Safari. After getting some comments on its horribleness in Opera, I installed Opera and gasped – My left floating sidebar had forced my main content to the bottom of the page. Ugh! Tomorrow more website redesign chaos will be taking place. Sorry for the inconvenience.

So, I spent my morning working on the code for this site. At this stage there are two known bugs: 1) If my blog entry is too short the sidebars hang off the bottom of the main text area in an awkward, half-forgotten kind of way, and 2) in Opera the dates on the entries are a bit too high and overlap the header. My solution to the first problem is simple; I need to make sure my blog entries are long enough or at least have a really nice large picture to take up space. I don’t think anyone will complain about this solution. The answer to the second problem should be to fix it, but at this moment in time I can’t find a good cross browser solution. According to Google Analytics, only 2.4% of my traffic comes from Opera, so I’ve decided I’m going to live with the bad date layout until I’m done traveling this month.

What I’d like to understand is why the browsers can’t be compatible with basic codes like “float.” The main reasons to use different browsers is being attached to how the handle certain niceties like buttons, graphics, borders, and fonts. These built in structures should look a bit different. That said – those structures shouldn’t move. I suspect that one of the main reasons many websites look trashed in Opera is that is just doesn’t seem to handle css div constructions that float structures in a nested fashion.

As a MacIntosh using web designer, I am particularly annoyed with how M$ has created so many things that only work in its browser, and that their software creates sites that only look good in their software. In their latest round of “We’re going to cross are arms and refuse to work and play well with other operating systems,” they discontinued support for IE for OS X. I don’t even have the option of checking to see how this looks on IE unless I go borrow a PC. Let me repeat: Ugh!

But for now, welcome to the latest version of my website. I’m still not entirely  happy with how it looks (I need a logo for Star Stryder), but it as good as I feel like getting it today.


  1. tx prof, I’ve just discovered ur website, throught the universe today podcast. coz im at the office today (rare event) I managed to see check ur webby without probs, however at home I do use opera as my main browser, and its great to hear that us on the “ethnic browser community” are not left out from great publications (as your blog). Once again thanks 😉 Dan (London,UK)

  2. As a webdeveloper I know this all to well.
    It get worse when you start doing complicated AJAX things. (mostly Opera is a pain there)

    I usually code for Firefox, tweaking here and there and safari works and IE7 aswel.

    Then comes the painfully IE6 hacking for png and things.

    Then opera… this repeats afew time till it all looks as it should.

    I think I spend about 2/3 of my time fixing browser incompatibilities.

  3. Sorry I didn’t send a screenshot before; I only noticed your comment just now.

    It’s looking much much better 😀 (I think there’s still some weirdness on the main page with the date and comments link of the first post being too high up, but the individual entry pages are fine)

    I really appreciate your efforts, too – as an opera devotee, I’m so used to pages that are mangled in opera, sites that just bounce you to a “please upgrade to internet explorer” message, and all sorts of other nasties…

  4. To help you solve your problems, use this website: http://v04.browsershots.org/ you can preview any website with any browser using that website’s feature. Hope that helps 🙂

  5. Since i don’t run an operating system compatible with IE, i don’t generally code for it. I did find a bug in the way IE handles tables of numbers, and bothered to find a workaround that happens to work in FireFox. But really, Windows users can download FireFox. So if my simple html 1.0 stuff doesn’t work in IE, at least those people have an out. But since i don’t use javascript, dhtml, css, etc., most things just work everywhere, and look pretty much the same. As a side effect, my pages are smaller and load faster, even on fast machines connected with high speed links. If you want eye candy, my sites aren’t for you.

  6. Hooray!

    I just discovered the site but had found that the layout code didn’t work in the browser I use: Konqueror 3.5 on Slackware Linux. The sidebar and the main content were overlayed on top of each other. But now everything looks good!

    And my sympathies to you. I’ve only had to design a website once, but it had to work with multiple browsers running on Windows and Linux, so these kinds of issues were in my face.

Submit a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.