[Wylug-help] HTML/CSS table width

[Christopher Birchall]

Hi Gary,

You could do it like this:

<style>
	.tableWide{
		width:100%;
	}
	.tableWide th{
		width:20%; /* or whatever width you want */
	}
</style>

<table class="tableWide">
	<tr>
		<th>left content</th>
		<td>right content</td>
	</tr>
</table>

The above code works in IE7 (and other browsers), but note that table
cells may be resized if content doesn't fit... should be ok with just
text data as resizing will probably just be vertical.

Or you could get rid of the table entirely and stick in another couple
of divs with set widths instead... ;-)

Chris Birchall 
IT and Web Officer 
Centre For Bioscience, The Higher Education Academy
9.14 Worsley Building
University of Leeds
www.bioscience.heacademy.ac.uk 


-----Original Message-----
From: wylug-help-bounces at wylug.org.uk
[mailto:wylug-help-bounces at wylug.org.uk] On Behalf Of Gary Stainburn
Sent: 07 May 2008 13:40
To: WYLUG HELP
Subject: [Wylug-help] HTML/CSS table width

Hi folks.

I'm trying to make one of my web sites prettier and I'm playing with CSS

again.

I have a div of a given width, and in that I have a table with width
100%.
This table then consists of 2 columns, one <th> and one <td>.

How can I define in the CSS how wide the 1st column (and thus the 2nd
column 
to)?  

I want to do this in CSS instead of HTML (a) to make the HTML prettier,
and 
(b) to make sure I don't forget to do it

This has to work with Internet Explorer as this is what all of my users
use 
(don't ask, it'll only wind me up)

-- 
Gary Stainburn
 
This email does not contain private or confidential material as it
may be snooped on by interested government parties for unknown
and undisclosed purposes - Regulation of Investigatory Powers Act, 2000


_______________________________________________
Wylug-help mailing list
Wylug-help at wylug.org.uk
https://mailman.lug.org.uk/mailman/listinfo/wylug-help