WithFlyingColors
WithFlyingColors

Reputation: 2760

Styling html table

  <table border="1" width="600" align="center">
       <tr>
         <td colspan="2" align="right">date</td>
       </tr>

         <tr>
            <td width="10%">avatar</td> //cant balance those two proportionally 10 to 90
            <td  width="90%">message</td>
         </tr>

        <tr>
            <td colspan="2" align="right">
                  <table border="1" width="600">
                    <tr>
                          <td width="48%"></td>
                            <td width="10%" align="center"><input type="button" value="Edit" style="width:50px"/> </td>
                            <td width="12%" align="center"><input type="button" value="Remove" style="width:60px"/> </td>
                            <td width="10%" align="center"><input type="button" value="Quote" style="width:50px"/> </td>
                            <td width="10%" align="center"><input type="button" value="Reply" style="width:50px"/> </td>
                            <td width="10%" align="center"><input type="button" value="Rep" style="width:50px"/> </td>
                    </tr>
                  </table>

            </td>


        </tr>
    </table>

If you look above the proportions fo those cells dont work. I want one cell to be 10% and the other 90%

Upvotes: 0

Views: 631

Answers (2)

Ananth
Ananth

Reputation: 4397

<table border="1" width="600" align="center">
   <tr>
     <td colspan="2" align="right">date</td>
   </tr>

     <tr>
        <td style="width:60px">avatar</td>
        <td style="width:540px">message</td>
     <tr>

    <tr>
        <td colspan="2" align="right">
              <table border="1" width="600">
                <tr>
                      <td width="48%"></td>
                        <td width="10%" align="center"><input type="button" value="Edit" style="width:50px"/> </td>
                        <td width="12%" align="center"><input type="button" value="Remove" style="width:60px"/> </td>
                        <td width="10%" align="center"><input type="button" value="Quote" style="width:50px"/> </td>
                        <td width="10%" align="center"><input type="button" value="Reply" style="width:50px"/> </td>
                        <td width="10%" align="center"><input type="button" value="Rep" style="width:50px"/> </td>
                </tr>
              </table>

        </td>


    <tr>
</table>

Upvotes: 1

ysrb
ysrb

Reputation: 6740

You miss tr on the first row.

<table border="1" width="600" align="center">
<tr>
         <td colspan="2" align="right">date</td>
</tr>
         <tr>
            <td width="10%" style="">avatar</td>
            <td  width="90%">message</td>
        <tr>
        <tr>
            <td colspan="2" align="right">
                  <table border="1" width="600">
                    <tr>
                          <td width="70%">&nbsp;</td>
                            <td width="10%" align="right"><input type="button" value="Quote" style="width:50px"/> </td>
                            <td width="10%" align="right"><input type="button" value="Reply" style="width:50px"/> </td>
                            <td width="10%" align="right"><input type="button" value="Rep" style="width:50px"/> </td>
                    </tr>
                  </table>

            </td>


        <tr>
    </table>

Upvotes: 0

Related Questions