Please explian why this does not work?

**ajfmrf** · 04-22-2011, 01:46 AM

http://www.web-user.net/rss/testa/tablestest3.html

Code:

!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title> Your Title </title>


<style type="text/css">
table
{
height:20px;
width:400px;
background-color:lightblue;
}
td
{
text-align:center;
}
.1
{
height:20px;
width:400px;
background-color:bisque;
}
td
{
text-align:center;
}
.2
{
height:10px;
width:600px;
background-color:lightgrey;
}
</style>
</head>

<body>
<table class="1">
<tr>
<td><a href="http://www.bing.com/news/search?q=&FORM=R5FD1&p1=[NewsVertical+Category%3d%22rt_US%22]" name="bingUS"> 
<img src="http://www.web-user.net/rss/images/bing.png" border="0" width="61" height="25" align="center"></a></td>
<td><font color="blue" size="1">&copy; 2011 bing.com</font></td>

<td><img src="http://www.web-user.net/rss/images/spacer1.gif" width="100" height="2"><img src="http://www.web-user.net/rss/images/top2.gif"></td>

</tr>
</table>
<br><br>
<table class="2">
<tr>
<td><a href="http://www.bing.com/news/search?q=&FORM=R5FD1&p1=[NewsVertical+Category%3d%22rt_US%22]" name="bingUS"> 
<img src="http://www.web-user.net/rss/images/bing.png" border="0" width="61" height="25" align="center"></a></td>
<td><font color="blue" size="1">&copy; 2011 bing.com</font></td>
<td><img src="http://www.web-user.net/rss/images/spacer1.gif" width="100" height="2"><img src="http://www.web-user.net/rss/images/top2.gif"></td>

</tr>
</table>

<br>
<table>
<tr>
<td><a href="http://www.bing.com/news/search?q=&FORM=R5FD1&p1=[NewsVertical+Category%3d%22rt_US%22]" name="bingUS"> 
<img src="http://www.web-user.net/rss/images/bing.png" border="0" width="61" height="25" align="center"></a></td>
<td><font color="blue" size="1">&copy; 2011 bing.com</font></td>
<td><img src="http://www.web-user.net/rss/images/spacer1.gif" width="100" height="2"><img src="http://www.web-user.net/rss/images/top2.gif"></td>

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

I am trying to get three tables with diffrent classes.Is this wrong to use or should it be 'id' instead.Why does it not make three different tables?

Thanks,

Bud

**traq** · 04-22-2011, 02:34 AM

You do have three different tables. If you're asking why the CSS classes aren't working (the height, width, etc.), it's because you are specifying different values in the html markup, which take precedence.

CSS means "Cascading Style Sheets." Inline style information (e.g., <img style="height: 100px;">) overrules embedded style information (e.g., <style>img{ height: 100px; }</style>), which overrules external style sheets (e.g., <link href="style.css" rel="stylesheet" type="text/css">).

Attributes on an element (e.g., <img height="100">) take precedence over any CSS rules, which is what is happening in your example: the images inside the tables have set dimensions, which push out the dimensions of the table.

(In addition, tags like <font> are depreciated: it would be best to remove them and use CSS instead. Some of the attributes you're using are not appropriate on the elements you're using them on, either: for example, the border and align attributes are depreciated for the <img> element. You should use CSS for this purpose as well.)

**ajfmrf** · 04-22-2011, 06:25 AM

I guess I need to go back to the drawing board so to speak.

I am still learning css.I need to use two tables -one quite a bit larger then the other and also keeping the height and width's in strict control

I am trying to keep two images and some text on one line with the text in the center. It seems as though a lot needs to be done to get this done.

I got to start testing more then I have I guess.lol

Bud

Thread: Please explian why this does not work?

Thread Tools

Search Thread

Please explian why this does not work?

The Following User Says Thank You to traq For This Useful Post:

thanks for the quick response

Bookmarks

Bookmarks

Posting Permissions