I've tried using tables for my site for the first time, and I want to know is it possible to put css in the table?
Basically my whole table works as planned, here is part of my table...
<TD ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
<HEAD>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
CONTENT GOES HERE
</TD>
As you can see I've tried integrating my css, the file IS called css.css and it IS in the same folder, and it worked on all my pages when I used iFrames, I've also tried linking to the url of the stylesheet but it still doesn't work, anyone know why?The HEAD section (including the link to your stylesheet) needs to come before the BODY section.Didn't workGood lord, what on earth are you trying to achieve?
If I fill in the huge gaps in that code example, and do it a little more correctly I get:
<html>
<HEAD>
<title>Title Goes Here</title>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
<body>
<table><tr>
<TD ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
CONTENT GOES HERE
</TD>
</tr></table>
<body>
</html>Good lord, what on earth are you trying to achieve?
If I fill in the huge gaps in that code example, and do it a little more correctly I get:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Title Goes Here</title>
<link rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"css.css" type="text/css">
</head>
<body>
<table>
<tr>
<td style="text-align: center; background-image: url('navbg.png'); width: 191px;">
Cell content goes here.
</td>
</tr>
</table>
</body>
</html>Didn't workCan we see your attempt so that we can tell what's wrong with them?That is taking it a little too far The Tree, besides.. wouldn't a strict doctype ***** up a storm about the inline style? (Or am I thinking XHTML1.1) And does not align="center" center a table rather than the text contained within?
Anyway, that table should be a DIV if you want to get THAT picky!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Title Goes Here</title>
<link rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"css.css" type="text/css">
<style type="text/css">
body{text-align:center;}
#content{margin:0 auto;text-align:left;background-image: url('navbg.png');width:191px;}
</style>
</head>
<body>
<div id="content">
Cell content goes here.
</div>
</body>
</html>Good lord, what on earth are you trying to achieve?
If I fill in the huge gaps in that code example, and do it a little more correctly I get:
<html>
<HEAD>
<title>Title Goes Here</title>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
<body>
<table><tr>
<TD ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
CONTENT GOES HERE
</TD>
</tr></table>
<body>
</html>
No you don't get what I mean, I want the css in that particular cell and it's not working, if you really want my full code here you go...
<HTML>
<HEAD>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
<BODY>
<TABLE BORDER=0 CELLSPACING=9 CELLPADDING=0>
<TR>
<TD COLSPAN="2" BACKGROUND="header.png" WIDTH="681" HEIGHT="131"></TD>
</TR>
<TR>
<TD VALIGN=top>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 ALIGN=top>
<TR><TD BACKGROUND="navtop.png" WIDTH="191" HEIGHT="6"></TD></TR>
<TR><TD VALIGN=top ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
NAVIGATION GOES HERE
</TD></TR>
<TR><TD BACKGROUND="navbot.png" WIDTH="191" HEIGHT="6"></TD></TR>
</TABLE>
<TD VALIGN=top>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 ALIGN=top>
<TR><TD BACKGROUND="contop.png" WIDTH="481" HEIGHT="6"></TD></TR>
<TR><TD VALIGN=top ALIGN=center BACKGROUND="conbg.png" WIDTH="481">
<HEAD>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
TEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TEST
</TD></TR>
<TR><TD BACKGROUND="conbot.png" WIDTH="481" HEIGHT="6"></TD></TR>
</TABLE>
</TR>
</TABLE>
</BODY>
</HTML>Well that looks clean enough (well actualy, no if doesn't but it wont be affecting your css) so I'd say that your CSS is the problem.
edit:You've linked to your CSS twice, just keep the one in the head element.
WoD No, a strict doctype wouldn't go wrong with inline styling, I was hoping that the table was being used legitimately and I don't think that it's going to far to get a page to tenuosly validate.It still doesn't work >_> shall I paste my stylesheet?Yes, it always helps to see what I'm talking about.<HEAD>
<style type=text/css>
body {background-color: transparent}
body{
scrollbar-3dlight-color: #999999;
scrollbar-arrow-color: #000000;
scrollbar-base-color: #999999;
scrollbar-darkshadow-color: #999999;
scrollbar-face-color: #999999;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #999999;
}
body {background-color: transparent}
a:link { color: black; text-decoration: none }
a:active { color: black; text-decoration: none }
a:visited { color: black; text-decoration: none }
a:hover { color: black; text-decoration: underline }
body{
font-family:verdana; font-size: 7pt; color: #000000}
</style>
</HEAD>
I know half that stuff isn't needed with tables, it's the stylesheet I used with iFrames, and before anyone asks about putting the transparent background bit it's cuz it wouldn't work without it twice :|
Anyway I also tried the same code with just the font bit still didn't work. Anyone got any ideas?I don't see why you put all that HTML into it. There doesn't seem to be any thing wrong with it apart from that (although I've taken the liberty of neatening it up). You might want to not that the whole scrollbar thing is non-standard so don't expect it to validate or work in anything other than IE.body{
scrollbar-3dlight-color: #999;
scrollbar-arrow-color: #000;
scrollbar-base-color: #999;
scrollbar-darkshadow-color: #999;
scrollbar-face-color: #999;
scrollbar-highlight-color: #000;
scrollbar-shadow-color: #000;
scrollbar-track-color: #999;
background-color: transparent;
font-family:verdana;
font-size: 7pt;
color: #000;
}
a {color: #000;}
a:link, a:active, a:visited {text-decoration: none; }
a:hover {text-decoration: underline; }Ah, the css was working all along, I just have to put the font size code in the cells.
Thanks for all your help.Ah, the css was working all along, I just have to put the font size code in the cells.No you don't, you can keep all presentation in the CSS file.I like validation, it makes me feel good about myself.
Basically my whole table works as planned, here is part of my table...
<TD ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
<HEAD>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
CONTENT GOES HERE
</TD>
As you can see I've tried integrating my css, the file IS called css.css and it IS in the same folder, and it worked on all my pages when I used iFrames, I've also tried linking to the url of the stylesheet but it still doesn't work, anyone know why?The HEAD section (including the link to your stylesheet) needs to come before the BODY section.Didn't workGood lord, what on earth are you trying to achieve?
If I fill in the huge gaps in that code example, and do it a little more correctly I get:
<html>
<HEAD>
<title>Title Goes Here</title>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
<body>
<table><tr>
<TD ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
CONTENT GOES HERE
</TD>
</tr></table>
<body>
</html>Good lord, what on earth are you trying to achieve?
If I fill in the huge gaps in that code example, and do it a little more correctly I get:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Title Goes Here</title>
<link rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"css.css" type="text/css">
</head>
<body>
<table>
<tr>
<td style="text-align: center; background-image: url('navbg.png'); width: 191px;">
Cell content goes here.
</td>
</tr>
</table>
</body>
</html>Didn't workCan we see your attempt so that we can tell what's wrong with them?That is taking it a little too far The Tree, besides.. wouldn't a strict doctype ***** up a storm about the inline style? (Or am I thinking XHTML1.1) And does not align="center" center a table rather than the text contained within?
Anyway, that table should be a DIV if you want to get THAT picky!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Title Goes Here</title>
<link rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"css.css" type="text/css">
<style type="text/css">
body{text-align:center;}
#content{margin:0 auto;text-align:left;background-image: url('navbg.png');width:191px;}
</style>
</head>
<body>
<div id="content">
Cell content goes here.
</div>
</body>
</html>Good lord, what on earth are you trying to achieve?
If I fill in the huge gaps in that code example, and do it a little more correctly I get:
<html>
<HEAD>
<title>Title Goes Here</title>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
<body>
<table><tr>
<TD ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
CONTENT GOES HERE
</TD>
</tr></table>
<body>
</html>
No you don't get what I mean, I want the css in that particular cell and it's not working, if you really want my full code here you go...
<HTML>
<HEAD>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
<BODY>
<TABLE BORDER=0 CELLSPACING=9 CELLPADDING=0>
<TR>
<TD COLSPAN="2" BACKGROUND="header.png" WIDTH="681" HEIGHT="131"></TD>
</TR>
<TR>
<TD VALIGN=top>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 ALIGN=top>
<TR><TD BACKGROUND="navtop.png" WIDTH="191" HEIGHT="6"></TD></TR>
<TR><TD VALIGN=top ALIGN=center BACKGROUND="navbg.png" WIDTH="191">
NAVIGATION GOES HERE
</TD></TR>
<TR><TD BACKGROUND="navbot.png" WIDTH="191" HEIGHT="6"></TD></TR>
</TABLE>
<TD VALIGN=top>
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 ALIGN=top>
<TR><TD BACKGROUND="contop.png" WIDTH="481" HEIGHT="6"></TD></TR>
<TR><TD VALIGN=top ALIGN=center BACKGROUND="conbg.png" WIDTH="481">
<HEAD>
<LINK REL=stylesheet HREF=http://www.webdeveloper.com/forum/archive/index.php/"css.css" TYPE="text/css">
</HEAD>
TEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TESTTEST<BR>
TEST<BR>
TEST
</TD></TR>
<TR><TD BACKGROUND="conbot.png" WIDTH="481" HEIGHT="6"></TD></TR>
</TABLE>
</TR>
</TABLE>
</BODY>
</HTML>Well that looks clean enough (well actualy, no if doesn't but it wont be affecting your css) so I'd say that your CSS is the problem.
edit:You've linked to your CSS twice, just keep the one in the head element.
WoD No, a strict doctype wouldn't go wrong with inline styling, I was hoping that the table was being used legitimately and I don't think that it's going to far to get a page to tenuosly validate.It still doesn't work >_> shall I paste my stylesheet?Yes, it always helps to see what I'm talking about.<HEAD>
<style type=text/css>
body {background-color: transparent}
body{
scrollbar-3dlight-color: #999999;
scrollbar-arrow-color: #000000;
scrollbar-base-color: #999999;
scrollbar-darkshadow-color: #999999;
scrollbar-face-color: #999999;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #999999;
}
body {background-color: transparent}
a:link { color: black; text-decoration: none }
a:active { color: black; text-decoration: none }
a:visited { color: black; text-decoration: none }
a:hover { color: black; text-decoration: underline }
body{
font-family:verdana; font-size: 7pt; color: #000000}
</style>
</HEAD>
I know half that stuff isn't needed with tables, it's the stylesheet I used with iFrames, and before anyone asks about putting the transparent background bit it's cuz it wouldn't work without it twice :|
Anyway I also tried the same code with just the font bit still didn't work. Anyone got any ideas?I don't see why you put all that HTML into it. There doesn't seem to be any thing wrong with it apart from that (although I've taken the liberty of neatening it up). You might want to not that the whole scrollbar thing is non-standard so don't expect it to validate or work in anything other than IE.body{
scrollbar-3dlight-color: #999;
scrollbar-arrow-color: #000;
scrollbar-base-color: #999;
scrollbar-darkshadow-color: #999;
scrollbar-face-color: #999;
scrollbar-highlight-color: #000;
scrollbar-shadow-color: #000;
scrollbar-track-color: #999;
background-color: transparent;
font-family:verdana;
font-size: 7pt;
color: #000;
}
a {color: #000;}
a:link, a:active, a:visited {text-decoration: none; }
a:hover {text-decoration: underline; }Ah, the css was working all along, I just have to put the font size code in the cells.
Thanks for all your help.Ah, the css was working all along, I just have to put the font size code in the cells.No you don't, you can keep all presentation in the CSS file.I like validation, it makes me feel good about myself.