Reputation: 363
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.
Upvotes: 0
Views: 310
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
Reputation: 115278
Firstly, remove the align
attribute as this is obsolete & deprecated and should no longer be used.
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
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
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
Reputation: 714
take that 'align = "center"' out and replace that with the '"left"'
Upvotes: 0