frre tyy
frre tyy

Reputation: 363

html content start on same indent

i have an html file that looks like this

<!DOCTYPE html>
<html>
<head>
  <title>Postgraduate students</title>
</head>
<body align = "center">

<h2>Postgraduate Students</h2>


   <br></br>
  <table align = "center" border = "5" width = "50%">
    <thead colspan = "4">
      <tr>
        <th>NAME</th>
        <th>Registration No.</th>
    </tr>
   </thead>

  <tbody>
      <tr>
          <td>IDI Mohammed</td>
          <td>SEP16/COMP/001X</td>
     </tr>

     <tr>
         <td>LUBINGA Robert</td>
         <td>SEP16/COMP/002U</td>
     </tr>
  </tbody>
 </table>
 </body>

How do i make the content in td start on the left border-line of the table ? Right now the table looks like this. table

Upvotes: 0

Views: 310

Answers (5)

lisarko8077
lisarko8077

Reputation: 307

You have to add this to css style:

tbody>tr>td { text-align: left }

If i were you I would get rid of align: center.

Upvotes: 0

Paulie_D
Paulie_D

Reputation: 115278

Firstly, remove the align attribute as this is obsolete & deprecated and should no longer be used.

MDN

Note: Do not use this attribute as it is obsolete (not supported) in the latest standard.

  • To achieve the same effect as the left, center, right, or justify values, use the CSS text-align property on it.

All tbody text will then align left by default.

To center the table, just use margin:auto.

table {
  margin: auto;
}
<table border="5" width="60%">
  <thead colspan="4">
    <tr>
      <th>NAME</th>
      <th>Registration No.</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>IDI Mohammed</td>
      <td>SEP16/COMP/001X</td>
    </tr>

    <tr>
      <td>LUBINGA Robert</td>
      <td>SEP16/COMP/002U</td>
    </tr>
  </tbody>
</table>

Upvotes: 0

GURURAJ DHARANI
GURURAJ DHARANI

Reputation: 468

In order to make text-align in table you have to use tex-align css property

<body align="center">
  <h2>Postgraduate Students</h2>
  <table align="center" border="5" width="50%">
    <thead colspan="4">
      <tr>
        <th>NAME</th>
        <th>Registration No.</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>IDI Mohammed</td>
        <td>SEP16/COMP/001X</td>
      </tr>

      <tr>
        <td>LUBINGA Robert</td>
        <td>SEP16/COMP/002U</td>
      </tr>
    </tbody>
  </table>

Check this link : Jsfiddle

tbody>tr>td {
  text-align: left
}

Upvotes: 1

Nolyurn
Nolyurn

Reputation: 608

In order to align the text to the left of your td, you can use the CSS property text-align and set the value to "left".

http://www.w3schools.com/cssref/pr_text_text-align.asp

<head>
    <title>Postgraduate students</title>
    <style type="text/css"> 
        td{text-align:left;}
    </style> 
</head>

You can try to modify your head content like this for a quick test but i recommand to use a css file.

Upvotes: 0

purna15111
purna15111

Reputation: 714

take that 'align = "center"' out and replace that with the '"left"'

Upvotes: 0

Related Questions