Web Hosting Talk







View Full Version : need help making a plans page


simple solutions
04-12-2007, 01:44 PM
Im new to coding with xhtml and div layers and need some help making a plans page. Could someone give me some quick code to make a plans page that consists of 4 vertical columns and 3 rows. the first column will be the feature list, the other 3 will be the plans. I only need 3 rows because i can catch on after i see the code. the total width will be about 700 and I store all my css info in a styles.css

thanks for the help!!

ennio
04-12-2007, 04:56 PM
If I understand you right:

html:

<div id="main">
<div class="block_1"></div>
<div class="block_2"></div>
<div class="block_3"></div>
<div class="block_4"></div>

<div class="block_1"></div>
<div class="block_2"></div>
<div class="block_3"></div>
<div class="block_4"></div>

<div class="block_1"></div>
<div class="block_2"></div>
<div class="block_3"></div>
<div class="block_4"></div>
</div>

css:

#main {
width: 700px;
margin: 0px auto;
}
.block_1 {
width: 175px;
height: 100px;
float: left;
}
.block_2 {
width: 175px;
height: 100px;
float: left;
}
.block_3 {
width: 175px;
height: 100px;
float: left;
}
.block_4 {
width: 175px;
height: 100px;
float: left;
}

killapix
04-13-2007, 07:08 AM
I would of thought that tables would be better suited to this type of data.?

<table width="700" border="1" cellspacing="0" cellpadding="1">
<tr>
<td id="feature_title">Features</td>
<td class="plan_title">Plan 1</td>
<td class="plan_title">Plan 2</td>
<td class="plan_title>Plan 3</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

just add a class to each row or <td> as you please, add this to have an extra row before the closing </table>:
<tr>
<td>content or image</td>
<td>content or image</td>
<td>content or image</td>
<td>content or image</td>
</tr>

Hope this helps