CSS & Tables

A

admin

Administrator
Staff member
<TABLE cellpadding="0" cellspacing="0" width="100%" class="tblContent"><TR><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD></TR><TR><TD colspan="7" class="tblLineH"></TD></TR><TR><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD></TR><TR><TD colspan="7" class="tblLineH"></TD></TR><TR><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD></TR><TR><TD colspan="7" class="tblLineH"></TD></TR><TR><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD><TD class="tblLineV"></TD><TD> xyz</TD></TR><TR><TD colspan="7" class="tblLineH"></TD></TR><TR><TD> xyz</TD><TD class="tblLineV"></TD><TD colspan="5"> </TD></TR></TABLE></TD></TR>

All the above TD's that have class="tblLineV" aren't taking any notice of the WIDTH: 1px; set in the CSS.

Can anyone help?

Thanks/...can you post your css? btw, you might want to get rid of the </TD></TR> after the </TABLE>body
{
COLOR: #000000;
MARGIN: 0px;
SCROLLBAR-3DLIGHT-COLOR: #c5d6fc;
SCROLLBAR-ARROW-COLOR: #4d6185;
SCROLLBAR-BASE-COLOR: #000000;
SCROLLBAR-DARKSHADOW-COLOR: #c5d6fc;
SCROLLBAR-FACE-COLOR: #c5d6fc;
SCROLLBAR-HIGHLIGHT-COLOR: #4d6185;
SCROLLBAR-SHADOW-COLOR: #4d6185;
SCROLLBAR-TRACK-COLOR: #e3ecfe;
}

table
{
BORDER-COLLAPSE: collapse;
BORDER: 0px 0px 0px 0px;
}

td
{
FONT-FAMILY: verdana, tahoma, arial;
FONT-SIZE: 11px;
}

.header
{
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr= '#4b92d9' , endColorStr= '#cedff6' , gradientType= '1' );
HEIGHT: 64px;
WIDTH: 100%;
}

.menu
{
BORDER-TOP: 1px solid #81a9e2;
}

#NavTd
{
BORDER-RIGHT: 1px solid #81a9e2;
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr= '#ffffff' , endColorStr= '#cadef4' , gradientType= '0' );
WIDTH: 209px;
}

#Nav
{
PADDING: 2px 0 10px 0px;
FONT: 1em Verdana, Arial;
}

#Nav .line
{
BORDER-TOP: solid 1px #81a9e2;
MARGIN: 5px 0 5px 0;
}

#Nav > .line
{
MARGIN: 6px 0 4px 0;
}

#Nav h4
{
MARGIN: 4px 0px 5px 5px;
FONT-SIZE: 95%;
}

#Nav > h4
{
MARGIN: 4px 0px 4px 5px;
}

#Nav ul
{
LIST-STYLE: none;
MARGIN: 0;
PADDING: 0;
}

#Nav li
{
PADDING: 0;
MARGIN: -2px 2px;
WIDTH: 205px;
}

#Nav > ul > li
{
MARGIN: -3px 2px;
}

#Nav a
{
CURSOR: pointer;
DISPLAY: block;
COLOR: #000000;
PADDING: 2px 4px 4px 8px;
MARGIN: 1px 0px;
}

#Nav > ul > li > a
{
BORDER: 1px solid transparent;
PADDING: 2px 4px 4px 7px;
}

#Nav a:visited
{
COLOR: #000000;
}

#Nav a:hover
{
BORDER: 1px solid #81a9e2;
MARGIN: 0px;
PADDING: 2px 4px 4px 7px;
BACKGROUND-COLOR: #eaf1fa;
TEXT-DECORATION: none;
}

#Nav > ul > li > a:hover
{
MARGIN: 1px 0px;
}

.body
{
BORDER-TOP: 1px solid #81a9e2;
HEIGHT: 100%;
WIDTH: 100%;
}

.tblHeader
{
BORDER: 1px solid #81a9e2;
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr= '#ffffff' , endColorStr= '#eaf1fa' , gradientType= '1' );
FONT-SIZE: 12px;
FONT-WEIGHT: bold;
PADDING: 5px 5px 5px 5px;
}

.tblContent
{
BORDER-RIGHT: 1px solid #81a9e2;
BORDER-LEFT: 1px solid #81a9e2;
PADDING: 8px 8px 8px 8px;
TEXT-ALIGN: justify;
}

.tblFooter
{
BORDER: 1px solid #81a9e2;
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr= '#ffffff' , endColorStr= '#eaf1fa' , gradientType= '1' );
FONT-SIZE: 11px;
FONT-WEIGHT: bold;
PADDING: 5px 5px 5px 5px;
TEXT-ALIGN: right;
}

.tblLineH
{
BORDER-TOP: 1px solid #81a9e2;
HEIGHT: 1px;
}

.tblLineV
{
BORDER-RIGHT: 1px solid #81a9e2;
WIDTH: 1px;
}

.tblBreak
{
HEIGHT: 25px;
}

td#qLinkToolBar
{
BORDER-TOP: 1px solid #81a9e2;
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr= '#ffffff' , endColorStr= '#4b92d9' , gradientType= '1' );
HEIGHT: 24px;
PADDING: 2px 6px 0px 2px;
WIDTH: 100%;
}

#qLinkToolBar a
{
COLOR: #0033cc;
TEXT-DECORATION: none;
}

a
{
COLOR: #000000;
TEXT-DECORATION: none;
}

a:hover
{
COLOR: #81a9e2;
TEXT-DECORATION: none;
}

.qLink
{
PADDING: 1px 4px 2px 5px;
}

.qLinkH
{
BORDER: 1px solid #81a9e2;
PADDING: 1px 4px 2px 4px;
}

.qLinkSep
{
COLOR: #999999;
PADDING: 0px 1px 2px 1px;
}

img
{
border: 0;
}

h1
{
COLOR: #1b4685;
FONT-FAMILY: trebuchet ms, verdana, arial, tahoma;
FONT-SIZE: 26px;
MARGIN: 0px;
PADDING: 0px 15px 0px 0px;
TEXT-ALIGN: right;
}

h2
{
COLOR: #4b92d9;
FONT-FAMILY: trebuchet ms, verdana, arial, tahoma;
FONT-SIZE: 24px;
PADDING: 10px 0px 10px 0px;
TEXT-ALIGN: center;
}

h3
{
FONT-FAMILY: trebuchet ms, verdana, arial, tahoma;
FONT-SIZE: 22px;
}

The </TD></TR> is there as I've got nested tables, so the code in the first post should've had <TR><TD> before <TABLE>

Thanks.,,,Why Is Everything In Capital Letters?Why not??

I do the tags in UPPERCASE and the tag attributes in lowercase.

What's wrong with that?uppercase selectors isnt really proper syntax, no idea if it causes issue though.

try putting a in the td with that particular class, perhaps its not reading it cuz there isnt anything there?

just a shot in the dark ;)


btw, fyi, W3C sayeth thus (<!-- m --><a class="postlink" href="http://www.w3.org/TR/xhtml1/#h-4.2">http://www.w3.org/TR/xhtml1/#h-4.2</a><!-- m -->)


4.2. Element and attribute names must be in lower case

XHTML documents must use lower case for all HTML element and attribute names. This difference is necessary because XML is case-sensitive e.g. <li> and <LI> are different tags.From Psalm 50, verse 9:I will accept no bull from thy houseFrom the W3C's CSS2 specification Chapter 4, Section 1, paragraph 3All CSS style sheets are case-insensitive, except for parts that are not under the control of CSS. For example, the case-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification. Note in particular that element names are case-insensitive in HTML, but case-sensitive in XML. [emphasis added]oops yeah my link was for xhtml not css, my mistake.

Thanks charles!
 
You must log in or register to reply here.
Back
Top