CSS malfunction - or user error?

tdikun21

02-07-2007, 06:52 AM

I've got an external file, with css in it that looks like this:

<style type="text/css">
table {width:750px; height: 1000px; border-width: 1px;}
.header {height:120px;}
.spacer {height:10px; background-color:#000000;}
.menu {width:300px; }
.sidebar {width:150px; }
</style>

the html looks like this:

<html>
<head>
<title>sample site</title>
<LINK REL=StyleSheet HREF="style.css" TYPE="text/css">
</head>
<body topmargin="0" leftmargin="0"><center>
<table>
<tr><td class="header" colspan="3"><h1>Amateur Theology...Banner/logo</h1></td></tr>
<tr><td class="spacer" colspan="3"> </td></tr>
<tr><td class="menu"><v align="center">
example
</td>
<td><iframe src="home.html" name="content" width="100%" Height="100%" border="0" scrolling="no"></iframe>
</td>
<td class="sidebar"><p align="right">Random schtuff, possibly ads</td>
</tr>
<tr><td class="footer" colspan="3"><h5>Cool footer thing/(c) info</h5></td></tr>
</table>
</body>
</html>

for some reason the css seems to not be affecting the size of the table, no matter what i change it to, the table size remains the same! (height & width)

can someone please help?

i want the width to be: 75% and height 100% but i cant get it to work!

ronaldb66

02-07-2007, 10:38 AM

First of all, an external style sheet shoud not contain a style element; only the style rules themselves.

Second, while you say you want the table width and height in percentages, you've specified absolute pixel values (750px = 750 pixels).

Third, while a 75% width shouldn't be a problem, a 100% height only works if both the html and the body element are set to 100% height as well, and even then it's a guess.

Last, you seem to misuse table markup for layout purposes; proper, fitting markup combined with CSS for presentational and layout purposes offer more possibilities for styling and more flexibility.

tdikun21

02-07-2007, 04:37 PM

thank you! that helped.