Good way to space colum content?

[jbutton]

Hi I'm new to web design but had a question about spacing content.

Say I'd like the page divided into 3 or 4 horizontal sections. THen within the middle 2 sections, I'd like 2 or 3 columns of data/content. What's a good way to space em?

Is it better to use tables within tables and then use cell-spacing and cell-padding? Or better to control it with CSS? Or is there another way?

Any links to tutorials would be greatly appreciated. Thanks.

 

[AusQB]

I think the best way would be to stack divs on top of each other as the horizontal sections, and then within the middle section, have a table with however many columns you want.

Here is a rough layout in HTML:

<div id="wrap">

     <div id="header"></div>

     <div id="body1">
          <table>
               <tr>
                    <td></td>
                    <td></td>
                    <td></td>
               </tr>
          </table>
     </div>

     <div id="body2">
          <table>
               <tr>
                    <td></td>
                    <td></td>
                    <td></td>
               </tr>
          </table>
     </div>

     <div id="footer"></div>

</div>

The "wrap" div is just to contain all the elements.

 

[mezangath]

Or do it with divs

CSS:

.spacingcollum {
positition:relative;
padding:2px;
height:12px;
width:30px;
display:inline-block;
}

HTML:

<div class="spacingcollum">MY PRECIUS</div><div class="spacingcollum">...GIMME COOKIES</div><div class="spacingcollum">I LIKE COOKIES</div>

 

[jbutton]

AUSQB and Mezangath, thanks for the great tips! I'll give it a try!