Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the correct usage of 'align' vs 'text-align'

I am trying to figure out the difference between putting an align attribute on a table cell vs using text-align css attribute. The code below shows different results in IE vs Others. In IE, the align ends up aligning every sub child, so the text 'test' is centered aligned, while in FF/Webkit this is not the case and it remains left aligned. What is the correct behavior?

<!DOCTYPE html>
<html>

 <head>
  <style>
   table { width: 60%; }
   table td { border: 1px solid black; }
  </style>
 </head>

 <body>
  <table>
   <tbody>
    <tr>
     <td align='center'>
      <table>
       <tbody>
        <tr>
         <td>test</td>
        </tr>
       </tbody>
      </table>
     </td>
    </tr>
   </tbody>
  </table>
 </body>

</html>
like image 855
Darth Avatar asked Dec 08 '22 01:12

Darth


1 Answers

The align attribute is old-style "tag-soup" HTML, deprecated according to an official W3 document. Prefer CSS styling, as with

<td style="text-align: center;">
    <!-- Content -->
</td>

Better still, give the TD a className (e.g., a semantic className like "center") and set that style in the stylesheet:

td.center {
    text-align: center;
}
like image 60
Robusto Avatar answered Mar 08 '23 13:03

Robusto