Fluid two-column layout snapping to single-column layout too soon

[Ravingdork]

I am working on a fluid, two-column layout web site for a friend of mine. However, when I compress the window frame, the right column jumps/snaps underneath the left column before the frame has even been reduced by half, leaving ugly white space to the right of the now left-aligned single column.

I would like the right column to continue compressing until is about the same default width of the left column before changing into a single column layout. I’ve toyed with the numbers and min- and max-widths, but I can’t seem to get anything to work.

You can see the site for yourself here.

[Ravingdork]

What’s border-box?

[Krish1980]

I would like the right column to continue compressing until is about the same default width of the left column before changing into a single column layout

You can use absolute positioning.

Codepen example

[Paulie_D]

A Codepen reduced case would be useful. This doesn’t sound difficult though.

[Author]

Posts