If at first you don’t succeed

2007 September 21
by Karen

Honestly, at least 60% of being good at web design is sheet amount of experience. I’ve been working on a way to resolve resizing issues with the new library homepage (get smaller than a certain size and an image covers up text). Part of the solution involved setting a min-width. But since IE doesn’t understand this property I had to take another approach, namely using a fixed width design that sits in the center of the page.

Since I’d never done this before I decided I’d do a web search on how to make a fixed width layout that sat in the middle of the page and had objects that were absolute positioned. Luckily, I found a 90% solution to my problems at MezzoBlue. The only caveat I found with this method is that it doesn’t work in Firefox. Oh the stuff is positioned properly, but if your absolution positioned object sits in line with any links they won’t be clickable. Not acceptable for my design. So I ended up writing a set of styles for IE and a set for everything else. This worked and now I have a version of the homepage which is fixed-width in IE and scales up but not down in other browsers. No more covered up text!

The solution took all my “free-time” this week researching, playing and tweaking. I hope to get approval to put it in place next week so that I can start working on doing similar things with my other layouts. Hopefully they will be easier because they don’t incorporate any absolute positioning. But then again floats may prove equally daunting.

One Response leave one →
  1. 2007 September 24
    Jonathan Blackburn permalink

    Glad you found an acceptable solution.

    You got me thinking about this whole issue again for our website, and I might try Yahoo’s (http://www.yahoo.com/) approach next time around. They use a fixed width design made for 1024×768 monitors (our most common by far) and provide a “switch to narrower layout” for people still using 800×600.

    Though I think your solution is probably more flexible – and provides a better experience for users with disabilities – I do like the convenience of designing for a fixed width. (Fluid really does require a paradigm shift of sorts that not everyone is ready for . . .)

    Of course, do not tell this to our librarian in charge of accessibility, as she routinely sees users with 23″ widescreen monitors with the browser text-size up all the way. Try that on a fixed width design and see what happens!

Leave a Reply

Note: You can use basic XHTML in your comments. Your email address will never be published.

Subscribe to this comment feed via RSS