Please explian why this does not work? [Archive]

View Full Version : Please explian why this does not work?

ajfmrf

04-22-2011, 01:46 AM

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

!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">© 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">© 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">© 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