Nested CSS Problem

Question

I have the following code:

<table class="top">
<tr>

    <td>
    <table class="errMsg"><tr><td>Required field must not be blank </td></tr></table>
<td/>
<tr/>
</table>

I am trying to style to the error message but the "top" style keeps applying:

.top td {
color:black;

}

.errmsg td {
color:red;
}

The error message comes out black...how can I fix this? Not sure if this matters but when I take out the dtd it works fine but it messes up the positioning.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<td/> and <tr/> should be </td> and </tr>.

Gert Grenander
– Gert Grenander

2010-07-29 19:44:50 +00:00
Commented Jul 29, 2010 at 19:44 — Gert Grenander
– Gert Grenander, Commented Jul 29, 2010 at 19:44

Gert Grenander · Accepted Answer · 2010-07-29 19:48:58Z

4

Class names are case sensitive, so errmsg is not the same as errMsg. Change <table class="errMsg"> to <table class="errmsg">.

answered Jul 29, 2010 at 19:48

Gert Grenander

17.1k6 gold badges42 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ChrisLively · Accepted Answer · 2010-07-29 19:52:04Z

1

I would use either a strict or transitional doctype. The xhtml doctype isn't well supported and my understanding is that it's basically going away.

for strict use:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

for transitional use:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

I almost always use strict as it offers the best browser support. Typically there are only a couple minor styles I need to set to fix some margins on certain tags.

Also, it's worth noting that when you completely remove the doctype line all browsers fall back to quirks mode, which is rarely a good thing. W3.org has a list of valid doctypes you might want to investigate.

edited Jul 29, 2010 at 19:52

answered Jul 29, 2010 at 19:46

ChrisLively

88.3k27 gold badges174 silver badges249 bronze badges

2 Comments

DD. Over a year ago

Still have the same issue...the "top" style is still applied

ChrisLively Over a year ago

See Gert G's answer; he caught the actual error. I still recommend strict for compatibility reasons though.

Collectives™ on Stack Overflow

Nested CSS Problem

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related