October 14th, 2012, 07:58 PM
|
|
Registered User
|
|
Join Date: Feb 2009
Posts: 2
Time spent in forums: 11 m 29 sec
Reputation Power: 0
|
|
|
Homework - Creating Three Columns of Content
I'm a non-coder, so please excuse the inline css while I am working to build my page.
I am creating the page in a Wordpress Post. I want to have a "featured" section in the middle of my page with three columns in it. My results wind up with two of the columns starting properly at the top of the container, while the third column winds up starting below those two, as if I had entered a carriage return.
I want a variable size page, so I am trying to use percentages, but am willing to go with pixels if need be. However, the main container is already a percentage and it would require working backwards a lot. Besides, I really like the cool things that css does adjusting to monitor size when percentages are in play.
Anyhoo, here's the relevant code. Can anyone tell me why the third column displays below the other two, and how to fix it?
Thanks,
Kirk
Code:
<div id="featured" style="height: 600px; display: block; background-image: url(<?php echo (site_url('/')); ?>wp-content/images/store-featured-bg.png); background-repeat: repeat-x; margin-right: 12%; padding: 12px; margin-top: 26px; ">
<span id="featured-left" style="height: 100%; display: block; float: left; width: 18%; text-align: center;">xxx</span><span id="featured-middle" style="height: 100%; display: block; text-align: center; margin-left: 20%; width: 56%; ">xxx</span><span id="featured-right" style="height: 100%; display: block; float: right; width: 18%; text-align: center;">xxx</span></div><!-- End featured-->
</div><!-- End main -->
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
