Comments on: Liquid + Fixed Two Column Lists with CSS

By: Albert

Albert — Fri, 18 Dec 2009 13:10:33 +0000

oh wow! padding-left! it’s so simple yet brilliant! this is one of those things that make you go: “now why didn’t I think of that?” lol

thanks for the tip!

By: Denis

Denis — Fri, 13 Nov 2009 22:10:41 +0000

Hi, thanks for the tutorial, can this be used for a “sandwich” layout:
fixed + liquid + fixed ?
At the moment, I can’t make it working, anybody any ideas?

By: henni

henni — Wed, 29 Jul 2009 13:24:34 +0000

thanks for that, very useful

By: Jason

Jason — Wed, 22 Jul 2009 12:44:03 +0000

I don’t know why I waste time checking the rest of the web for answers cause I always end up finding them here. Thanks again Soh, just what I needed help with.

By: Louis

Louis — Tue, 07 Jul 2009 19:47:23 +0000

Help — I ran into two issues related to printing the page:
1. if any content in tags precedes the tag then the printed version starts a new page regardless of how much white space is unused.
Example, add, “View the table” just before the . Then open print preview & you’ll see.

2. The last row of every page is cut off. The next page begins with the next row. copy/paste the last two rows of your sample and append to end of list a few times & you’ll see this clearly.

By: Louis

Louis — Fri, 03 Jul 2009 18:15:01 +0000

beautiful! worked like a charm.
I’m glad I checked back for your answer. I was messing around with display:inline-block which also fixed but needed different paddings for ie6 (& hence a different css).

By: Soh

Soh — Thu, 02 Jul 2009 22:38:25 +0000

Ah, you know what I apologize to both, I was misunderstanding what the issue was. Thanks Louis for making that clear for me~

I just tried a quick fix that worked. (seems to be an IE6 Bug) If you wrap your content (content inside of “detail”) with another div with a float: left; it got rid of the problem for me.

Let me know if that works out for you~

Thanks again fellas

By: Louis

Louis — Thu, 02 Jul 2009 20:06:48 +0000

Great tutorial. Please double check Steven’s complaint though. Viewing your sample in IE6/SP2, any text that extends below the image will jog over to the left slightly — about 2-3 characters.
You might need to make browser window a little smaller to make text or bullets on right extend vertically.
I’ve tried adjusting paddings & margins for all, but can’t seem to get rid of this.
Any ideas?

By: CW Web Solutions

CW Web Solutions — Fri, 12 Jun 2009 17:38:10 +0000

Great tutorial. Love your site’s design.

By: Steven

Steven — Thu, 14 May 2009 11:05:24 +0000

Thanks for quick response. I’ve checked your solution again in IE6 SP2 ( used in my company ) and it doesn’t work properly. I do not know why, maybe it depends on browser version or something…