...

View Full Version : Help with The code of this table



RichardSturm
06-13-2012, 06:10 PM
Hello,
I am trying to get the text that appears below the graphic so that the margins are inline with the graphic above.

Any help would be appreciated.

Website: http://www.sturmfinancial.com/Started.4.htm

Thank you,
Richard

awgentry
06-13-2012, 06:41 PM
It'll be a bear to try to work that out, and it isn't what tables were made for. Drop the tables and use CSS instead:



<style>
.box { display:block; float:left; width:160px; padding:20px; }
.clear { clear:both; }
</style>

...

<div class="box">
<img src="retire.jpg" alt="Retirement" /><br />
Text description goes here.
</div>

<div class="box">
<img src="401k.jpg" alt="401k" /><br />
Text description goes here.
</div>

<div class="box">
<img src="opinion.jpg" alt="Opinion" /><br />
Text description goes here.
</div>

<br class="clear" />
<!-- This makes the next box start on a new row. -->

<div class="box">
<img src="college.jpg" alt="College" /><br />
Text description goes here.
</div>

...

This puts each graphic-and-description set in its own box with a bit of padding, and each box next to the previous one.

Check out MaxDesign's Floatutorial, (http://css.maxdesign.com.au/floatutorial/index.htm) particularly Tutorial 4 (http://css.maxdesign.com.au/floatutorial/tutorial0407.htm), for more details.

RichardSturm
06-14-2012, 04:45 PM
Thank you, AW!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum