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

Internet Explorer won't hide nested paragraphs

P: n/a
Hi all,

On my site I have a section of code that resembles the following:

<p id="gear" style="display: none;">
<p>test</p>
</p>

This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?

Mar 11 '07 #1
Share this Question
Share on Google+
16 Replies


P: n/a
VK
On Mar 11, 7:12 pm, "danep" <danepow...@gmail.comwrote:
Hi all,

On my site I have a section of code that resembles the following:

<p id="gear" style="display: none;">
<p>test</p>
</p>

This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?
You cannot nest paragraphs: each P element ends up by meeting closing
</ptag or by meeting opening tag of any other block element
including another P - whatever comes first. This behavior by design
and by standards. If you really need to nest block elements, don't use
P, use other elements - say DIV.

Mar 11 '07 #2

P: n/a
On Mar 11, 11:26 am, "VK" <schools_r...@yahoo.comwrote:
On Mar 11, 7:12 pm, "danep" <danepow...@gmail.comwrote:
Hi all,
On my site I have a section of code that resembles the following:
<p id="gear" style="display: none;">
<p>test</p>
</p>
This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?

You cannot nest paragraphs: each P element ends up by meeting closing
</ptag or by meeting opening tag of any other block element
including another P - whatever comes first. This behavior by design
and by standards. If you really need to nest block elements, don't use
P, use other elements - say DIV.
Thanks, I changed the outer one to a DIV and it does the trick, though
it required rewriting a lot of CSS. Strange, if what you say is true,
that for once IE conforms to standards and FF doesn't.

Mar 11 '07 #3

P: n/a
danep schreef:
Hi all,

On my site I have a section of code that resembles the following:

<p id="gear" style="display: none;">
<p>test</p>
</p>

This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?
When I try this at home,
using Firefox,
the word test is still displayed

--
Rob Waaijenberg
Mar 11 '07 #4

P: n/a
VK
On Mar 11, 7:36 pm, "danep" <danepow...@gmail.comwrote:
You cannot nest paragraphs: each P element ends up by meeting closing
</ptag or by meeting opening tag of any other block element
including another P - whatever comes first. This behavior by design
and by standards. If you really need to nest block elements, don't use
P, use other elements - say DIV.

Thanks, I changed the outer one to a DIV and it does the trick, though
it required rewriting a lot of CSS. Strange, if what you say is true,
that for once IE conforms to standards and FF doesn't.
Hard to believe but it happens as well :-)
I guess it is because Gecko browsers have to accommodate XHTML rules
as well atop of HTML with possible "Appendix C trickery" thus fell-
formed XHTML served as text/html. Just a speculation from my side.

Mar 11 '07 #5

P: n/a
danep wrote:
>>
<p id="gear" style="display: none;">
<p>test</p>
</p>
This renders fine in Firefox (that is, nothing is displayed).

Thanks, I changed the outer one to a DIV and it does the trick, though
it required rewriting a lot of CSS. Strange, if what you say is true,
that for once IE conforms to standards and FF doesn't.
Because you did not provide an URL, there is no definitive way to say
why FF displays as you expected. A likely reason is that you are missing a
DTD (doctype), using an invalid one, or XHTML.
Also your example was invalid implying other invalid markup.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Mar 11 '07 #6

P: n/a
On Mar 11, 4:12 pm, "danep" <danepow...@gmail.comwrote:
On my site I have a section of code that resembles the following:

<p id="gear" style="display: none;">
<p>test</p>
</p>
Invalid.
This renders fine in Firefox (that is, nothing is displayed).
So it error corrects and happens to do what you want.
However, in Internet Explorer, "test" is still printed.
So it error corrects and does something other than what you wanted.

Mar 11 '07 #7

P: n/a
In article <11**********************@8g2000cwh.googlegroups.c om>,
"danep" <da********@gmail.comwrote:
On Mar 11, 11:26 am, "VK" <schools_r...@yahoo.comwrote:
On Mar 11, 7:12 pm, "danep" <danepow...@gmail.comwrote:
Hi all,
On my site I have a section of code that resembles the following:
<p id="gear" style="display: none;">
<p>test</p>
</p>
This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?
You cannot nest paragraphs: each P element ends up by meeting closing
</ptag or by meeting opening tag of any other block element
including another P - whatever comes first. This behavior by design
and by standards. If you really need to nest block elements, don't use
P, use other elements - say DIV.

Thanks, I changed the outer one to a DIV and it does the trick, though
it required rewriting a lot of CSS. Strange, if what you say is true,
that for once IE conforms to standards and FF doesn't.
Not really strange. If your HTML is invalid (and a P within a P is
always invalid) then any browser has to handle the problem as an error
condition. There is no standard for handling errors, which is part of
the reason so many people here say you must supply validated HTML.

--
http://www.ericlindsay.com
Mar 11 '07 #8

P: n/a
In our last episode,
<11**********************@p10g2000cwp.googlegroups .com>, the lovely and
talented danep broadcast on comp.infosystems.www.authoring.html:
Hi all,
On my site I have a section of code that resembles the following:
><p id="gear" style="display: none;">
<p>test</p>
</p>
This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?
A paragraph containing a paragraph is not valid, and in fact, in HTML 4.01,
it is impossible since the second <pis presumed to close the first
P element. Your markup (not "code" because HTML is a markup language, not
a programing language --- the ML stands for markup) is invalid because it
has an extra </p>. Whatever a browser does with invalid markup is okay;
after all you broke your document by using invalid markup. IE did the
right thing and assumed the extra </pwas an error. Firefox did the right
thing because it happened to guess what you might have meant to.

You do not always get consistency when you have a valid document. But you
cannot expect consistency at all when you do not have a valid document.

Bottom line: P is a block element that cannot contain any block element.
You cannot nest P. Why in the world would you think that you could?

--
Lars Eighner <http://larseighner.com/ <http://myspace.com/larseighner>
Countdown: 680 days to go.
Mar 11 '07 #9

P: n/a
On 11 Mar, 16:12, "danep" <danepow...@gmail.comwrote:
On my site I have a section of code that resembles the following:

<p id="gear" style="display: none;">
<p>test</p>
</p>

This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed.
I was surprised to see your claim here that FF displays nothing and so
renders this incorrectly. I then tried it out myself (with an
appropriat page header added) and AFAICS, FF is correct and does show
"text".

Of course I should have simply ignored your posting as:
* It discusses complicated rendering behaviour
* It's a posted example, not a live URL
* It's a partial fragment.

Any of these is reason that we need to see exactly what you're seeing,
otherwise we just can't expect to see the same behaviour. Which
doctype did you use? Which doctype declaration? Which content-type?
As to why it does all this, then it's quite simple. However it's an
SGML parsing issue, not an invalid code issue. Although error
correction mechanisms in each browser are (legitimately) potentially
different, they all ought to parse valid SGML correctly even if this
doesn't mean quite what the author intended.

<pcan't nest a <pinside it, so the start of the 2nd <pimplictly
closes the first one. It's not "nested" and so the display property
obviously isn't (and shouldn't be) inherited.
It's still valid though (there are plenty of valid pages without a
single </pend tag anywhere near them).

Compare these instead:

<p style="display: none;">
<p>test</p>.

<div style="display: none;">
<p>test (div)</p>
</div>

See the difference? Try looking with the FF DOM Inspector

These are still valid HTML and are sufficient to give the behaviour
that has puzzled you. They're not _invalid_ until we encounter the
second </p>, which is an end tag to an element that has already been
closed.

Browsers may well vary in how they handle this spurious end tag
(another reason to use valid code). However explaining your specific
issue doesn't require invalidity.

Mar 12 '07 #10

P: n/a
In article <11*********************@30g2000cwc.googlegroups.c om>,
do*****@gmail.com says...
On Mar 11, 4:12 pm, "danep" <danepow...@gmail.comwrote:
On my site I have a section of code that resembles the following:

<p id="gear" style="display: none;">
<p>test</p>
</p>

Invalid.
NO it's not. Well, it is, but not the way you think.
In HTML, the </pis optional, so the "invalidity" is an extra </p>.
>
This renders fine in Firefox (that is, nothing is displayed).
Hard to believe, and not what happens here.

--
Advice is cheap, so always give the best. - Alfred Lawson
http://graspages.cjb.cc/
Mar 15 '07 #11

P: n/a
On Wed, 14 Mar 2007 23:58:18 GMT
Joe (GKF) <jo********@yahoo.com.auwrote:
In article <11*********************@30g2000cwc.googlegroups.c om>,
do*****@gmail.com says...

Invalid.
NO it's not. Well, it is, but not the way you think.
You're new here. I suggest learning to google next time you feel
inclined to accuse someone of ignorance, lest your own be manifest.
Hard to believe, and not what happens here.
Not so hard to believe. We have enough context to know the OP
is out of his depth, but not enough to know what other style
definitions may apply. So anything could happen.

--
Nick Kew

Application Development with Apache - the Apache Modules Book
http://www.apachetutor.org/
Mar 15 '07 #12

P: n/a
On 15 Mar, 00:59, Nick Kew <n...@grimnir.webthing.comwrote:
Not so hard to believe. We have enough context to know the OP
is out of his depth, but not enough to know what other style
definitions may apply. So anything could happen.
What sort of stylesheet would you need for FF to make an unadorned <p>
invisible, yet now affect IE?

I think observer error is a far more likely explanation here, rather
than peculiar stylesheets.

Mar 15 '07 #13

P: n/a
Eric Lindsay wrote:
In article <11**********************@8g2000cwh.googlegroups.c om>,
"danep" <da********@gmail.comwrote:
>On Mar 11, 11:26 am, "VK" <schools_r...@yahoo.comwrote:
>>On Mar 11, 7:12 pm, "danep" <danepow...@gmail.comwrote:

Hi all,
On my site I have a section of code that resembles the following:
<p id="gear" style="display: none;">
<p>test</p>
</p>
This renders fine in Firefox (that is, nothing is displayed).
However, in Internet Explorer, "test" is still printed. It appears
that the inner <pdoes not inherit the "display: none;" property or
somesuch. Is there a way to force IE to hide the nested paragraphs
without specifically specifying "display: none;" in every single one?
You cannot nest paragraphs: each P element ends up by meeting closing
</ptag or by meeting opening tag of any other block element
including another P - whatever comes first. This behavior by design
and by standards. If you really need to nest block elements, don't use
P, use other elements - say DIV.
Thanks, I changed the outer one to a DIV and it does the trick, though
it required rewriting a lot of CSS. Strange, if what you say is true,
that for once IE conforms to standards and FF doesn't.

Not really strange. If your HTML is invalid (and a P within a P is
always invalid) then any browser has to handle the problem as an error
condition.
This wasn't an error, unless there was an XHTML doctype. A P element
doesn't have to be explicitly closed, so the browser will know that the
start of the second P element implies that the first one has closed, and
will not treat the two Ps as being situated one after the other, not one
nested inside the other. There is no error until the second </pis
reached, because at that point there is no open P element awaiting
closure. But by the time that happens, the first two P elements have
been successfully processed and the browser is happy with them.
Mar 15 '07 #14

P: n/a
VK
On Mar 15, 12:46 pm, "Andy Dingley" <ding...@codesmiths.comwrote:
What sort of stylesheet would you need for FF to make an unadorned <p>
invisible, yet now affect IE?

I think observer error is a far more likely explanation here, rather
than peculiar stylesheets.
Your own possible misinterpretation is false a priori I guess? ;-)

AFAICT all "after-wave" posters are former attendants of the "XHTML in
my heart" school. The opposition "XHTML in my heart" VS. "XHTML in my
Content-Type" is now historical as XHTML itself: but the habit of
taking XHTML as some mental construct (the first school) still
remains. At least no one seems tried an XHTML page like:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css">
#outer {
visibility: hidden;
}
</style>
</head>
<body>
<h1>P demo</h1>
<p id="outer">Outer<p>Inner</p></p>
</body>
</html>
SERVED AS: application/xhtml+xml
Have they done that they would see what OP saw, with both paragraphs
invisible and DOM tree as
P
|_ #text
|_P
|_ #text

That is perfectly correct and expected effect because i) Web UAs are
_non-validating_ agents and because ii) some UAs have to accomodate
both HTML and XHTML.
If one holds both Firefox and even SeaMonkey as non-conformant, then
take the SeaMonkey code for the base - as the most "credo pure" - and
make your own "really correct" UA.
;-)

Mar 15 '07 #15

P: n/a
In article <pc************@grimnir.webthing.com>,
ni**@grimnir.webthing.com says...
On Wed, 14 Mar 2007 23:58:18 GMT
Joe (GKF) <jo********@yahoo.com.auwrote:
In article <11*********************@30g2000cwc.googlegroups.c om>,
do*****@gmail.com says...
>
Invalid.
NO it's not. Well, it is, but not the way you think.

You're new here. I suggest learning to google next time you feel
inclined to accuse someone of ignorance, lest your own be manifest.
Internet advice from Nick Kew. Wow.
I really must be ignorant,too, because I STILL think that the closing
</pis optional. No amount of Googling has convinced me otherwise.
I probably should have "said '... the way you MAY think ...', the 'you'
being generic, and not directed to Dave D.", but life is too short to
dot every tee and cross every eye. (Which accounts for DDs one word
dismissal of the snippet)
>
Hard to believe, and not what happens here.

Not so hard to believe. We have enough context to know the OP
is out of his depth, but not enough to know what other style
definitions may apply. So anything could happen.
Indeed. But all we had to go on was the snippet, and viewed here (and I
suspect, elsewhere) the snippet does not behave as reported.
>

--
Advice is cheap, so always give the best. - Alfred Lawson
http://graspages.cjb.cc/
Mar 16 '07 #16

P: n/a
Joe (GKF) wrote:
<p id="gear" style="display: none;">
<p>test</p>
</p>
>Invalid.
NO it's not.
Well, it is, but not the way you think.
If it is, then don't shout that it isn't.
In HTML, the </pis optional, so the "invalidity" is an extra </p>.
I know. But invalid is invalid and error correction in tag soup slurpers is
mysterious voodoo.

.... and that's in HTML, the OP didn't specify if they were using HTML or
XHTML.

--
David Dorward <http://blog.dorward.me.uk/ <http://dorward.me.uk/>
Home is where the ~/.bashrc is
Mar 16 '07 #17

This discussion thread is closed

Replies have been disabled for this discussion.