Please need help with table code

Discussion in 'HTML & Website Design' started by Dee2007, Jun 23, 2009.

  1. #1
    Hi :)

    I did the table in Works and whilst it looks fine in there, when I save as HTML, the text isn't centered with the boxes, the 3 boxes are different sizes and also want the "Titles to be bold but I don't want to change the font size.

    Please can anyone help :)

    I'm just trying to get it to look as neat and compact as possible.

    Here is the code:

    <HTML>
    <HEAD>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">
    <META NAME="Generator" CONTENT="Internet Assistant for Word Version 3.0">
    </HEAD>
    <BODY>

    <TABLE BORDER CELLSPACING=2 BORDERCOLOR="#00005b" CELLPADDING=2 WIDTH=535>
    <TR><TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=32>
    <B><FONT FACE="Arial" SIZE=1 COLOR="#7373a6"><P ALIGN="CENTER">Plan</B></FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=32>
    <B><FONT FACE="Arial" SIZE=1 COLOR="#7373a6"><P ALIGN="CENTER">Price</B></FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=32>
    <B><FONT FACE="Arial" SIZE=1 COLOR="#7373a6"><P ALIGN="CENTER">Duration Of Shift/Session</B></FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=32>
    <B><FONT FACE="Arial" SIZE=1 COLOR="#7373a6"><P ALIGN="CENTER">What’s Included</B></FONT></TD>
    </TR>
    <TR><TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER">Premium</FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER">£0.99</FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER"> Up to 4 hours</FONT></TD>
    <TD WIDTH="25%" VALIGN="TOP" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P>Practice or Hospital, Name, Contact phone number and Time of shift.</FONT></TD>
    </TR>
    <TR><TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER">Deluxe</FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER">£2.99</FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER"> Up to 4 hours</FONT></TD>
    <TD WIDTH="25%" VALIGN="TOP" HEIGHT=57>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P>Practice or Hospital, Name, Contact phone number, Time of shift, Hourly rate. </FONT></TD>
    </TR>
    <TR><TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=80>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER">Ultimate</FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=80>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER">£4.99</FONT></TD>
    <TD WIDTH="25%" VALIGN="MIDDLE" HEIGHT=80>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P ALIGN="CENTER"> Up to 8 hours</FONT></TD>
    <TD WIDTH="25%" VALIGN="TOP" HEIGHT=80>
    <FONT FACE="Arial" SIZE=1 COLOR="#00005b"><P>Practice or Hospital, Name, Contact phone number, Time of shift, hourly rate and detailed description of what is required.

    </FONT></TD>
    </TR>
    </TABLE>

    <FONT SIZE=2></FONT></BODY>
    </HTML>


    Thanks in advance :)

    Dee
     
    Dee2007, Jun 23, 2009 IP
  2. ZoidTech

    ZoidTech Banned

    Messages:
    117
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Ok i have tidied up your code for you and have posted it below.

     <html>
    <head>
    <meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="Generator" content="Internet Assistant for Word Version 3.0">
    <title></title>
    
    <style type="text/css">
     p.c4 {color: #00005B; font-family: Arial; font-size: 70%}
     p.c3 {color: #00005B; font-family: Arial; font-size: 70%; text-align: center}
     p.c2 {text-align: center}
     span.c1 {color: #7373A6; font-family: Arial; font-size: 70%}
    </style>
    </head>
    <body>
    <table border cellspacing="2" cellpadding="2" width="535">
    <tr>
    <td width="25%" valign="middle" height="32">
    <p class="c2"><strong><span class="c1">Plan</span></strong></p>
    </td>
    <td width="25%" valign="middle" height="32">
    <p class="c2"><strong><span class="c1">Price</span></strong></p>
    </td>
    <td width="25%" valign="middle" height="32">
    <p class="c2"><strong><span class="c1">Duration Of Shift/Session</span></strong></p>
    </td>
    <td width="25%" valign="middle" height="32">
    <p class="c2"><strong><span class="c1">What's Included</span></strong></p>
    </td>
    </tr>
    <tr>
    <td width="25%" valign="middle" height="57">
    <p class="c3">Premium</p>
    </td>
    <td width="25%" valign="middle" height="57">
    <p class="c3">�0.99</p>
    </td>
    <td width="25%" valign="middle" height="57">
    <p class="c3">Up to 4 hours</p>
    </td>
    <td width="25%" valign="top" height="57">
    <p class="c4">Practice or Hospital, Name, Contact phone number and Time of shift.</p>
    </td>
    </tr>
    <tr>
    <td width="25%" valign="middle" height="57">
    <p class="c3">Deluxe</p>
    </td>
    <td width="25%" valign="middle" height="57">
    <p class="c3">�2.99</p>
    </td>
    <td width="25%" valign="middle" height="57">
    <p class="c3">Up to 4 hours</p>
    </td>
    <td width="25%" valign="top" height="57">
    <p class="c4">Practice or Hospital, Name, Contact phone number, Time of shift, Hourly rate.</p>
    </td>
    </tr>
    <tr>
    <td width="25%" valign="middle" height="80">
    <p class="c3">Ultimate</p>
    </td>
    <td width="25%" valign="middle" height="80">
    <p class="c3">�4.99</p>
    </td>
    <td width="25%" valign="middle" height="80">
    <p class="c3">Up to 8 hours</p>
    </td>
    <td width="25%" valign="top" height="80">
    <p class="c4">Practice or Hospital, Name, Contact phone number, Time of shift, hourly rate and detailed description of what is required.</p>
    </td>
    </tr>
    </table>
    </body>
    </html>
    
    
    Code (markup):
    Also to answer your other question to make your titles bold wrap the title in,

    <h2>Text Of Header Here</h2>
    HTML:
    You can define the style of the <h2> tags by CSS.

    -Z-
     
    ZoidTech, Jun 24, 2009 IP