How important do you think liquid CSS is?

[uqwebdesign]

I've been designing sites for a couple of years and haven't really bothered with liquid CSS, I've just designed my sites for a specific resolution specified by them.

Do you think I should learn about liquid CSS and utilise it in my future sites, or is your opinion that it's overrated?

[masonbarge]

You really have to do something for people on 800x600 monitors - they hate having to scroll sideways. Liquid is best if your site can stand it, otherwise you need an alternate style sheet or just a site that fits into 800x600 resolution. It isn't hard to do liquid, it's just a case of whether your design can handle it. It can get tough if you want three columns and have graphics.

[Rob]

I think liquid is often seen used in combination with the max-width property.... simply because some designs can look very odd at big resolutions.

Liquid design is becoming more and more popular... they are generally pretty flexible across a number of devices, but then.... it all comes down to personal taste at the end of the day.

[ukgeoff]

As has already been said your design needs to work at 800 x 600 without having to scroll sideways. Users hate it.

I recently checked the stats and 16% of users are still using 800 x 600.

You have to decide if you feel there is any benefit to the end user of having a fluid layout.

Typically you would only have the main content area change in width in a three column layout.

IMO this is not hard but it raises its own questions. Users apparently do not like to scan long lines of text on screen, so what do you do about that?

Also consider the fact that a lot of users whilst having larger screens and resolutions do not work with the browser, or other applications for that matter, at full screen size.

At the moment, I'm still in the design for 800 x 600 camp and centre the design in the browser window.

[uqwebdesign]

Interesting point Geoff, I too was in this camp a few months ago.

I'd read somewhere else, can't remember where now, that the % of users at 800x600 was under 10% (your figures were probably more accurate than mine) so have recently been designing with 1024x768 in mind just for my own site, and using whatever a client has stated to me for theirs.

I think from what people are saying I will look into liquid, I did try it on my current layout but differences between firefox and ie were annoying me so I gave up after a while. I'll definitely look into it for the next site I do though.

What do others think?

[Rob]

Like I said.... fluid is fine... but max-width is your friend.

[minute44]

Originally Posted by Rob

Like I said.... fluid is fine... but max-width is your friend.

Bare in mind that max/min width is not always interpreted well by IE

[jpmitchell]

@minute44 - guess what IE7 has fixed Min/Max Width.

Also I think the user resolution percent is going to be based on the site market. For example if a particular site is for web designers and developers then their resolution is likely to be higher and thus the 800x600 percent will be lower. But if a site is geared toward churches for example the 800x600 percent will be much higher.

So you have to target your design and your implementation to the audience.

my $0.02

[minute44]

Originally Posted by jpmitchell

@minute44 - guess what IE7 has fixed Min/Max Width.

Also I think the user resolution percent is going to be based on the site market. For example if a particular site is for web designers and developers then their resolution is likely to be higher and thus the 800x600 percent will be lower. But if a site is geared toward churches for example the 800x600 percent will be much higher.

So you have to target your design and your implementation to the audience.

my $0.02

Have you tried the IE 7 beta?

Man, it may have fixed the min/max width thing but it still sucks!

[jpmitchell]

I have been using IE7 beta ever since it went public. Its at least a step in the right direction.

[herkalees]

Originally Posted by minute44

Bare in mind that max/min width is not always interpreted well by IE

Do a search on IE + min width + expression, it's a good fix that works 100% of the time.

It's not really a hack either, just a property/value that only IE understands.

[minute44]

Originally Posted by herkalees

Do a search on IE + min width + expression, it's a good fix that works 100% of the time.

It's not really a hack either, just a property/value that only IE understands.

oh cool, only problem is... how's your audience gonna know? Good for techies but not for the audience.

[herkalees]

Originally Posted by minute44

oh cool, only problem is... how's your audience gonna know? Good for techies but not for the audience.

I don't follow you, why would the audience need to know? If they're using IE, and a min/max-width effect is working out nicely, they're happy and non-the-wiser

[minute44]

sorry, I think I misunderstood you.

I thought you were saying that there was a plug-in that the user had to download for IE to interpret min/max width right.

I was saying; shouldn't making things display correctly fall on the designer and not the user?

[herkalees]

Originally Posted by minute44

sorry, I think I misunderstood you.

I thought you were saying that there was a plug-in that the user had to download for IE to interpret min/max width right.

I was saying; shouldn't making things display correctly fall on the designer and not the user?

Yup, a little misunderstanding. No plugin needed, IE listens to the expression property when it's placed in the CSS file.

The user just browses in their undies and doesn't know the difference.

[craig]

IMO, I.E 7 was the biggest let down. It may have fixed a couple of things but its screwed around with some big ones. It fucks up CSS navigation a fair bit, and is more of a memory hog than Firefox.
I'll stick to Firefox, just wish it would come with every computer

[herkalees]

Originally Posted by craig

It fucks up CSS navigation a fair bit...

While IE7 didn't fix all CSS bugs, it definitely hasn't created any new ones. If you're experiencing broken css nav, look at your code, not IE7.

[jpmitchell]

I agree with herkalees. IE7 isnt perfect, but it truly has come leaps and bounds from its 6 year old IE6 where nearly everything had to be hacked or worked around to get it to display as the standards called for. So if something is wrong it is likey your code

[minute44]

Anyway, Back on topic...

Liquid CSS, like anything else, has it's place. It is used to greatest effect in 3 column layouts to resize the middle column but it is also ok to use elsewhere.

I've found though, to get the best browser interoperability on your site, go for a fixed width that suits the largest percentage of your target audience. People on resolutions too low to view the site will be no stranger to our friend the scrollbar anyway.

If you make it too narrow you'll just upset the portion of the audience on big monitors or high resolutions.

Not only is broser optimizaton an issue, you have to consider if your site will be able to handle a liquid layout. If you use lot's of graphics then chances are it won't. In this case don't ruin your site just to get a liquid layout.. It probably isn't worth it.

[mreine]

The choice is liquid for a maximum audience. It doesn't really matter then if they prefer thinner or wider widths of text, they simply adjust their browser width to exactly the size they want and walla!

Sure, certain designs aren't going to work as a fluid layout, but that doesn't mean you can't adjust the design to accomadate a fluid layout. Whether or not you ruin the site by forgoing certain graphics or features is very subjective. You could visit any site and find stuff that could be taken out and would never be missed. Some of the best sites I visit are extremely basic in design and have very minimal if any fluff. Some people call this boring... I call it unadulterated information!

Getting a fluid site to do what you want can be extremely frustrating, but you have to be willing to let CSS be CSS and learn to compromise and adapt. Try to think through issues logically. You will often realize that whatever it is giving you fits is doing so because you are attempting something that isn't supposed to happen logically. Make the necessary adjustments and continue on.