Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    4
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Help with The code of this table

    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

  • #2
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    6
    Thanks
    0
    Thanked 2 Times in 2 Posts
    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:

    Code:
    <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, particularly Tutorial 4, for more details.

  • Users who have thanked awgentry for this post:

    RichardSturm (06-14-2012)

  • #3
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    4
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thank you, AW!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •