Novel way to do multi column layouts.

I created a right border on the content div of the same width and color as the rail, then floated the rail div over it. The margin-right:-150px on the content div allows the rail div to move into the newly vacated space. If the content div is taller than the rail div, the border grows with it making it appear that the rail is growing. I set the container’s background color to match the content so if the rail div is the tallest, the container grows with it and it appears that the content column is growing. It only takes a small change to the CSS to make the rail left-aligned, whether the content or the rail is taller.

Link

Related Leave a Comment