table cell alignment : table data : Table Style HTML CSS TUTORIALS


HTML CSS TUTORIALS » Table Style » table data »

 

table cell alignment


 

<?xml version"1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Adding Text Alignmnet</title>
    <style type="text/css">
      td {border:1px solid black;}
      table {border:1px solid black;}
      td.number{text-align: right;color: blue;}
      td.text{text-align: left;}
    </style>
  </head>
  <body>
    <table summary="This table">
      <caption>Our Pizza Selections</caption>
      <thead>
        <tr>
          <th scope="col">Pizza Type</th>
          <th scope="col">Small</th>
          <th scope="col">Medium</th>
          <th scope="col">Large</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td class="text" scope="row">Thin Crust</td>
          <td class="number">3.99</td>
          <td class="number">4.99</td>
          <td class="number">6.99</td>
        </tr>
        <tr>
          <td class="text" scope="row">Deep Dish</td>
          <td class="number">4.99</td>
          <td class="number">6.99</td>
          <td class="number">8.99</td>
        </tr>
        <tr>
          <td class="text" scope="row">Stuffed Crust</td>
          <td class="number">5.99</td>
          <td class="number">7.99</td>
          <td class="number">9.99</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>

 



HTML code for linking to this page:

Follow Navioo On Twitter

HTML CSS TUTORIALS

 Navioo Table Style
» table data