Created
May 8, 2013 00:22
-
-
Save ehgoodenough/5537283 to your computer and use it in GitHub Desktop.
By styling the columns as table, you can ensure that all elements of the page remain the same height, regardless of the amount of content.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE hmtl> | |
| <html> | |
| <head> | |
| <style> | |
| body | |
| { | |
| margin:0px; | |
| } | |
| #partition | |
| { | |
| width:100%; | |
| display:table; | |
| table-layout:fixed; | |
| border-spacing:25px; | |
| background-color:#EEE; | |
| } | |
| .part | |
| { | |
| display:table-cell; | |
| vertical-align:top; | |
| color:#EEE; | |
| padding:25px; | |
| font-family:Calibri; | |
| background-color:#2F2F2F; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="partition"> | |
| <div class="part">Hello World! How are you today?</div> | |
| <div class="part">Lorem ipsum dolor sit amet, consectetur | |
| adipiscing elit. Nulla condimentum elementum est eu venenatis. | |
| Vivamus purus massa, condimentum vel gravida ac, porta non sapien. | |
| Donec scelerisque, lacus sit amet iaculis facilisis, dolor urna | |
| ultrices nibh, et vulputate nisl sem sed tortor. Pellentesque egestas, | |
| augue eget placerat pharetra, enim justo aliquam orci, eu aliquet mi arcu | |
| id erat. Integer sapien augue, porta at ornare vitae, blandit id metus.</div> | |
| </div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment