Question HTML - tables

R

Rom

Hello everybody,

here's my problem :
I have a table with 3 rows and 2 columns. Is it possible to right-align
the text in the left column without writing thrice "<td align="right">" ?

Here's the code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head><title></title></head>
<body>
<table border="1" width="20%">
<tr>
<td colspan="2" align="center">Data</td>
</tr>

<tr>
<td>A</td><td align="right">1</td>
</tr>

<tr>
<td>B</td><td align="right">2</td>
</tr>

<tr>
<td>C</td><td align="right">3</td>
</tr>

</table>
</body>
</html>
 
J

Jonathan N. Little

Rom said:
Hello everybody,

here's my problem :
I have a table with 3 rows and 2 columns. Is it possible to right-align
the text in the left column without writing thrice "<td align="right">" ?

Here's the code :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head><title></title></head>
<body>
<table border="1" width="20%">
<tr>
<td colspan="2" align="center">Data</td>
</tr>

<tr>
<td>A</td><td align="right">1</td>
</tr>

<tr>
<td>B</td><td align="right">2</td>
</tr>

<tr>
<td>C</td><td align="right">3</td>
</tr>

</table>
</body>
</html>


Since your "Data" and "A", "B" & "C" cell appear to be heading not data
cells, style them differently, (look up TH element).

In your stylesheet:

TABLE { width: 20%, border: 1px solid black; }
TH, TD { border: 1px solid black; }
TD { text-align: right; }


Your HTML:

<table>
<tr><th colspan="2">Date</th></tr>
<tr><th>A</th><td>1</td></tr>
<tr><th>B</th><td>2</td></tr>
<tr><th>C</th><td>3</td></tr>
</table>

If you want more that one type of styling for your data cell then create
classes like:

..totals, .bucks { text-align: right: padding-right: .5em; }
..totals { font-weight: bold; }
 
R

Rom

Jonathan N. Little a écrit :
Since your "Data" and "A", "B" & "C" cell appear to be heading not data
cells, style them differently, (look up TH element).

In your stylesheet:

TABLE { width: 20%, border: 1px solid black; }
TH, TD { border: 1px solid black; }
TD { text-align: right; }


Your HTML:

<table>
<tr><th colspan="2">Date</th></tr>
<tr><th>A</th><td>1</td></tr>
<tr><th>B</th><td>2</td></tr>
<tr><th>C</th><td>3</td></tr>
</table>

If you want more that one type of styling for your data cell then create
classes like:

.totals, .bucks { text-align: right: padding-right: .5em; }
.totals { font-weight: bold; }
Thanks. that's precisely what I was looking for ;)
See you.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,743
Messages
2,569,478
Members
44,898
Latest member
BlairH7607

Latest Threads

Top