Copy and paste the code into your editor, and copy the image file fauxtest.png and put it into a your images folder. I have set the color of the centercenter div to white so you can see how it expands and the columns stay a constant color.
Take out this Lorem ipsum text and notice what happens.
Lorem ipsum dolor sit amet, sed do eiusmod tempor incididunt cupidatat non proident. Ullamco laboris nisi ut enim ad minim veniam, mollit anim id est laborum. Consectetur adipisicing elit, lorem ipsum dolor sit amet, excepteur sint occaecat. Cupidatat non proident, ut aliquip ex ea commodo consequat. Sunt in culpa ullamco laboris nisi lorem ipsum dolor sit amet. Consectetur adipisicing elit, qui officia deserunt cupidatat non proident. Sed do eiusmod tempor incididunt excepteur sint occaecat duis aute irure dolor. Quis nostrud exercitation consectetur adipisicing elit, ut aliquip ex ea commodo consequat. Ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, eu fugiat nulla pariatur. Ut enim ad minim veniam, duis aute irure dolor velit esse cillum dolore. Mollit anim id est laborum. Ut aliquip ex ea commodo consequat. Qui officia deserunt quis nostrud exercitation excepteur sint occaecat. Ut enim ad minim veniam, duis aute irure dolor eu fugiat nulla pariatur. Ut aliquip ex ea commodo consequat. Quis nostrud exercitation qui officia deserunt consectetur adipisicing elit. Lorem ipsum dolor sit amet, ut enim ad minim veniam, eu fugiat nulla pariatur. Ut labore et dolore magna aliqua.
Expanding when you type in more text. Take out the lorem ipsum and see what happens.
If you would like text to stand out, you can do this.
Ut enim ad minim veniam, duis aute irure dolor cupidatat non proident. Ullamco laboris nisi qui officia deserunt sunt in culpa. Mollit anim id est laborum. In reprehenderit in voluptate.
Sed do eiusmod tempor incididunt quis nostrud exercitation ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, Velit esse cillum dolore excepteur sint occaecat ut labore et dolore magna aliqua. Or you could wrap the text around an image with the same code.qui officia deserunt eu fugiat nulla pariatur. Ut labore et dolore magna aliqua. Duis aute irure dolor ullamco laboris nisi lorem ipsum dolor sit amet. Cupidatat non proident, ut aliquip ex ea commodo consequat.Cupidatat non proident, ut aliquip ex ea commodo consequat.Cupidatat non proident, ut aliquip ex ea commodo consequat.
Set the margin to auto to center.
Cupidatat non proident, lorem ipsum dolor sit amet, ut enim ad minim veniam. Duis aute irure dolor consectetur adipisicing elit, ut aliquip ex ea commodo consequat. Ut labore et dolore magna aliqua. In reprehenderit in voluptate velit esse cillum dolore duis aute irure dolor.
These two mini div's are wrapped in their own container or wrapper div. The contaner div is floated right, the two mini's are floated left.
You have to make sure that you take into account any padding, margins or borders, or it can effect your alignment.
