By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,787 Members | 1,124 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,787 IT Pros & Developers. It's quick & easy.

Tag nesting problems (in content management system)

P: n/a
Hi everyone,

I am trying to debug someone's site which has

<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>

The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.

It's problematic because it's a huge site (around 500 pages), it's in
MS Content Management Server 2002 (which means I can't access more
than one page at any one time - no global find/replace!, and templates
mean I have no access to the <head>) and this is occuring throughout
with all H1, H2, H3 tags that have an <a> within. Also because it's a
content management server, it's all been done through a user authoring
interface that automatically nests the tags in this order. Messy!!

I have tried using the !important tag in external CSS to give the
heading tags precedence over the <a> but it isn't working. Is there
any way I can force the <H3> to override the <a> when they are ordered
like this?

Thanks
Jul 20 '05 #1
Share this Question
Share on Google+
9 Replies


P: n/a
jetobe wrote:

<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>

The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.
As it should.
because it's a content management server, it's all been done
through a user authoring interface that automatically nests the
tags in this order. Messy!!
No, not messy. Conforming. <a><h3>heading</h3><a> is illegal syntax.
Is there any way I can force the <H3> to override the <a> when they
are ordered like this?


You can't force anything on the web. But the following css should
give you better results:

h3 a { color: blue; }

Since your question is about css, why did you x-post to ciwah?
(f'ups set)

--
Brian
follow the directions in my address to email me

Jul 20 '05 #2

P: n/a
Brian <us*****@julietremblay.com.invalid-remove-this-part> wrote:
jetobe wrote:

<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>

The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.
As it should.


Well, in a sense, yes. Tags don't really _do_ anything. But browsers
naturally apply their default rules for links, whether the links appear
inside headings or not.

By the way, the href value is almost surely wrong. We seem to have got
a _distorted_ snippet of markup instead of a URL that would tell what the
situation really is.
But the following css should
give you better results:

h3 a { color: blue; }


Some some strange value of "better". Now if the user's browser has settings
that use green color for unvisited links and gray color for visited links,
the user will be mislead into thinking that it's not a link at all.
(I'm pretty sure that I'm right in guessing that the author has
"successfully" removed the underlining of links.)

Strange things will also happen when the user has set blue background and
white and yellow text colors for links.

And for the great _majority_, the vital distinction between unvisited and
visited links would be lost.

Links want to be links. (See http://www.cs.tut.fi/~jkorpela/www/links.html )
Don't play with their appearance unless you are doubly sure of what you are
really doing.

It's questionable whether links should appear in headings, but in some cases
(e.g., a heading is a news headline, followed by a short version of the
news, and the heading is a link to the full version) it's quite OK. And in
those cases it is vital that they _look_ like links.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #3

P: n/a
jetobe wrote:
I am trying to debug someone's site which has

<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>

The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.
You mean there are styles applied to <a> elements that you don't want to
apply to <a> elements within <h3> elements?

Also because it's a content management server, it's all been done through
a user authoring interface that automatically nests the tags in this
order. Messy!!
No, /valid/. <a> elements cannot contain <h3> elements, if you were
thinking about changing the documents in that way.

I have tried using the !important tag in external CSS to give the
heading tags precedence over the <a> but it isn't working.
It shouldn't. The !important declaration means that it should take priority
over user declarations in some cases. It's got nothing to do with making
elements inherit their parent's styling.

Is there any way I can force
You can't force anything. You can only suggest.

the <H3> to override the <a> when they are ordered like this?


Simply construct an appropriate selector and style matching elements
appropriately:

h3 a {
/* Your styles here */
}

Without knowing exactly what presentation you want to change, it's
impossible to say exactly which rules you should use. You'll probably want
to make use of the 'inherit' keyword though.

For future reference, it's better to supply a URL to an example document.
--
Jim Dabell

Jul 20 '05 #4

P: n/a
*Jim Dabell* <ji********@jimdabell.com>:
jetobe wrote:
I have tried using the !important tag

Keyword -- actually "!" and "important" are separate keywords.
The !important declaration means that it should take priority over user
declarations in some cases.
Yes.
It's got nothing to do with making elements inherit their parent's styling.


Well, actually it does somehow.

foo {color: green !important}
foo bar {color: red}
foo,bar {color: orange}

<foo>Green <bar>Green</bar></foo> <bar>Orange</bar>

The selector "foo bar" has a higher specifity than "foo", but !important
declarations are only affected by specifity, if the other declaration is
!important too, thus:

foo bar {color: blue !important}
foo {color: green !important}
foo bar {color: red}
foo,bar {color: orange}

<foo>Green <bar>Blue</bar></foo> <bar>Orange</bar>

+--------------------<REC-CSS2 - 6.4.1 Cascading order>--------------------+
| 2. The primary sort of the declarations is by weight and origin: |
| (...) "!important" declaration override normal declarations. (...) |
| 3. The secondary sort is by specificity of selector: (...) |
| 4. Finally, sort by order specified: (...) latter specified wins. |
+--------------------------------------------------------------------------+

I'm certain not all browsers get this right. Hopefully I did.

P.S.: Yes, 'orange' is not a valid color keyword in CSS2.

--
Useless Fact #12:
The national anthem of Greece has 158 verses. No one in Greece has memorized all
158 verses.
Jul 20 '05 #5

P: n/a
In article <bn***********@ariadne.rz.tu-clausthal.de> in
comp.infosystems.www.authoring.stylesheets, Christoph Paeper
<cr***********@gmx.net> wrote:
Useless Fact #12:
The national anthem of Greece has 158 verses. No one in Greece has memorized all
158 verses.


No one?

In the words of W. Edwards Deming, "How do you know this? On what
basis do you know this?"

(And do you really mean verses or stanzas?)

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/
Jul 20 '05 #6

P: n/a
Jukka K. Korpela wrote:
Brian wrote:
jetobe wrote:
<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>

The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.
the way, the href value is almost surely wrong.


I didn't notice that. I must have been tired when I answered the post.
the following css should give you better results:

h3 a { color: blue; }


Some some strange value of "better". Now if the user's browser has settings
that use green color for unvisited links and gray color for visited links,
the user will be mislead into thinking that it's not a link at all.


I stuck that in as an example, and what a bad example it was. I
should have put font-size: 100% instead of a color declaration without
a background color declared. Apologies.

--
Brian
follow the directions in my address to email me

Jul 20 '05 #7

P: n/a
Thanks everyone for your help, sorry I couldn't post an example URL as
it's intranet. (And yes the URL in the example was fake, and wrong,
my mistake, as real link was internal).

To clarify, there are some headings that they want to be linked, as
well as lower level items.

eg.

Queensland Acts (links to general page containing links to all Acts)
- Act #1
- Act#14

etc (link to acts with specific relevance).
Headings are maroon & larger, links are blue and underlined. Linked
headings are intended be Maroon & underlined & larger & there are
different shades for visited etc.

I will try the h3 a {..} suggestion.

Thanks.


Jim Dabell <ji********@jimdabell.com> wrote in message news:<do********************@giganews.com>...
jetobe wrote:
I am trying to debug someone's site which has

<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>

The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.


You mean there are styles applied to <a> elements that you don't want to
apply to <a> elements within <h3> elements?

Also because it's a content management server, it's all been done through
a user authoring interface that automatically nests the tags in this
order. Messy!!


No, /valid/. <a> elements cannot contain <h3> elements, if you were
thinking about changing the documents in that way.

I have tried using the !important tag in external CSS to give the
heading tags precedence over the <a> but it isn't working.


It shouldn't. The !important declaration means that it should take priority
over user declarations in some cases. It's got nothing to do with making
elements inherit their parent's styling.

Is there any way I can force


You can't force anything. You can only suggest.

the <H3> to override the <a> when they are ordered like this?


Simply construct an appropriate selector and style matching elements
appropriately:

h3 a {
/* Your styles here */
}

Without knowing exactly what presentation you want to change, it's
impossible to say exactly which rules you should use. You'll probably want
to make use of the 'inherit' keyword though.

For future reference, it's better to supply a URL to an example document.

Jul 20 '05 #8

P: n/a
*Stan Brown* <th************@fastmail.fm>:
comp.infosystems.www.authoring.stylesheets, Christoph Paeper
The national anthem of Greece has 158 verses. No one in Greece has memorized
all 158 verses.


In the words of W. Edwards Deming, "How do you know this? On what
basis do you know this?"


As with most signatures around, this is a shameless unverified rip-off from
someone somewhere somewhen I don't remember.
F'up2 poster

--
A bus station is where a bus stops,
a train station is where a train stops,
on my desk I have a work station...
Jul 20 '05 #9

P: n/a
Tim
On 28 Oct 2003 18:39:52 -0800,
ja********@dpi.qld.gov.au (jetobe) wrote:
I am trying to debug someone's site which has

<h3><a href="www.legislation.qld.gov.au">Queensland Acts</a></h3>
Which is the proper way to do it.
The problem is that the <a> tag is taking precedence and overriding
the <h3> tags that they want the text to resemble.
What are you hoping that the H3 *ELEMENT* is going to do? Having the
contents *also* a link means that the text is going to be highlighted as
a link (possibly coloured and underlined), as well as whatever H3
renders as (probably a bigger and bolder font).

Or another way to put that, is what don't you want the A element inside
a H3 element to do?

(H3 meaning a sub-sub-heading, just in case you're trying to do
something oddball with H3 elements, too.)
It's problematic because it's a huge site (around 500 pages), it's in
MS Content Management Server 2002 (which means I can't access more
than one page at any one time - no global find/replace!, and templates
mean I have no access to the <head>) and this is occurring throughout
with all H1, H2, H3 tags that have an <a> within. Also because it's a
content management server, it's all been done through a user authoring
interface that automatically nests the tags in this order. Messy!!
Actually it's doing it correctly, which is a nice change.
I have tried using the !important tag in external CSS to give the
heading tags precedence over the <a> but it isn't working. Is there
any way I can force the <H3> to override the <a> when they are ordered
like this?


All I can guess is that you want the content of H3 elements to look the
same whether there's a link, or not, inside them (and that's only a
guess). If that's right, then you want to play with styling the A
elements that are children of H elements, to modify how those particular
A elements will look (without affecting the rest, nor necessitating you
having to make special classes of elements in the HTML). Leave your
styling for your H3 elements alone.

Something like:

h3 > a {text-decoration: none;}

See: <http://www.w3.org/TR/REC-CSS2/selector.html#q1>
<http://www.w3.org/TR/CSS2/text.html#q3>

--
My "from" address is totally fake. (Hint: If I wanted e-mails from
complete strangers, I'd have put a real one, there.) Reply to usenet
postings in the same place as you read the message you're replying to.
Jul 20 '05 #10

This discussion thread is closed

Replies have been disabled for this discussion.