Two divs, side by side. Sounds easy right?
Try it.
It’s not as easy as it looks.
Though I have come up with a solution.
The HTML:
Column content
2nd Column content
The CSS
.twoColumns {
width: 49.5%;
float: left;
}
.twoColumns + .twoColumns {
margin-left: 1%;
}
That should get you started on experimenting on your own.
If your curious, the + is an adjacent sibling selector.
[block:important]Note: If content after the “two columns” are broken, you may have to do a <div style="clear: both" ></div>.[/block]
[block:warning]Warning: If you add a border it won’t work, as you’ll break the width of the boxes. One solution is to put another div, inside the column. [/block]
