Computer Webmaster Gaming Console Graphics Forum

Welcome to the Computer Webmaster Gaming Console Graphics Forum forums.

You are currently viewing our boards as a guest which gives you limited access to view most discussions and access our other features. By joining our free community you will have access to post topics, communicate privately with other members (PM), respond to polls, upload content and access many other special features. Registration is fast, simple and absolutely free so please, join our community today!

If you have any problems with the registration process or your account login, please contact contact us.

MK PitStop Main Earn $25 Earn Money Posting Extras Members Blogs Image Hosting User Pages
Go Back   Computer Webmaster Gaming Console Graphics Forum > Webmaster Forum > Website Coding > HTML
Register FAQ/Rules Become A V.I.P. Member Search Today's Posts Mark Forums Read

HTML HTML problems, maybe you are trying to code for MySpace. Get all the HTML coding help here for your website.

Google
Reply
 
LinkBack Thread Tools Display Modes
Old 07-01-2007, 12:22 PM   #1
Jukka K. Korpela
 
Jukka K. Korpela's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!

"Hans Börjesson" <hansb@vendimo.REM.com> wrote:

> Is it possible to use nested <div> tags?


Of course. Wasn't this easy to check from HTML specifications?

> The sample is not html validated


Why bother playing with it then? You can throw all kinds of tag soups
and sallads at browsers and watch them misbehave, but it's not
civilized entertainment.

> and require javascript to be enabled


Well, then it's not an HTML problem and surely has nothing to do with
the question on the Subject line.

> <div id="div1" name="div1" style="top:10;left:10;display:block;">


All correctly behaving browsers ignore that style sheet. Well,
technically they don't ignore the last declaration, but it coincides
with the initial (default) setting. This, in turn, has nothing to do
with HTML and nothing to do with JavaScript.

Hint: Create an HTML page that works robustly. Use validators to
help you in this if you understand what a DTD is. Time permitting, add
then some optional CSS. Don't forget to use available CSS checkers.
Having done this, you might try to play with JavaScript, and then
comp.lang.javascript is surely the best group to ask for help.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html


 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Advertisements
Old 07-01-2007, 12:23 PM   #2
Hans Börjesson
 
Hans Börjesson's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!

Ok here is a validated document then. Still the same problem. Maybe you are
right this is a javascript problem but it does not have to be. I would say
that it could also be an html problem for example if nested <div> tags is
not feasible (now you say it is feasible so I guess you are right that it is
not a html problem but I was too stupid to realise this) or it can be a
rendering problem in the browser (IE and Opera does not behave in the same
way as for example Netscape in this case). Well I will give it a try in
javascript newsgroup but I guess they will forward me to yet another
newsgroup...

Anyway thanx for you help
Regards
/Hans Börjesson


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<TITLE>DIV Test</TITLE>
</head>

<body>
<div id="div1" >
This is Div1!
<div id="div2" >
This is Div2!
</div>
</div>
<br>
<br>

<form id="frm1" action="http://www.w3c.org/" method="post">
<input type="button" value="Toggle Div1" onclick="ToggleDiv('div1');">
<input type="button" value="Toggle Div2" onclick="ToggleDiv('div2');">
</form>

<script language="javascript" type="text/javascript">
<!--
function ToggleDiv(div_in) {
var mydiv;
mydiv = document.getElementById(div_in);
if (mydiv.style.visibility == "hidden")
mydiv.style.visibility = "visible";
else
mydiv.style.visibility = "hidden";
}
//-->
</script>
</body>
</html>


 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Old 07-01-2007, 12:23 PM   #3
Mark Parnell
 
Mark Parnell's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!

Hans Börjesson wrote:
> Ok here is a validated document then. Still the same problem.
>

<snip>

I get the same problem as you do, in both Mozilla and IE. I would certainly
say that it is a JS problem, but I can't help you there, I'm afraid.

Good luck with it.

--

Mark Parnell
http://www.clarkecomputers.com.au


 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Old 07-01-2007, 12:23 PM   #4
rf
 
rf's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!


"Hans Börjesson" <hansb@vendimo.REM.com> wrote in message
news:bd8o4g$e$1@yggdrasil.utfors.se...
> Ok here is a validated document then. Still the same problem. Maybe you

are
> right this is a javascript problem but it does not have to be. I would say
> that it could also be an html problem for example if nested <div> tags is
> not feasible (now you say it is feasible so I guess you are right that it

is
> not a html problem but I was too stupid to realise this) or it can be a
> rendering problem in the browser (IE and Opera does not behave in the same
> way as for example Netscape in this case). Well I will give it a try in
> javascript newsgroup but I guess they will forward me to yet another
> newsgroup...


<snip code>

If you have a quick look at section 11.2 of the CSS2 specs:
http://www.w3.org/TR/REC-CSS2/visufx.html#visibility
you will see that the default value for the visibility property is inherit.
That is, inherit the visibility property value of the parent element.

When you first open this page div1 _inherits_ visible from the body element
(which BTW has inherited this from the html element). div 2 also _inherits_
visible.

When you click toggle div 1 the visibility property of div1 gets set to
hidden. Since the visibility property of div2 is still inherit then div2
disappears as well, since it inherits hiddenness.

When you click toggle div 1 again, the reverse happens, with the exception
that the value for div1 is now visible. Div2 inherits this and magically
reappears.

Now, click toggle div2. Sure enough div2 disappears. Click toggle div2
again. Now, the visibility property has a value of visible, not inherit.
Div2 reappears.

Now, click toggle div1. Div1 is now hidden, it disappears. What about div2
though. It no longer inherits this value, its visibility property has the
value visible, just like you told it to. Div2 remains visible.

That wasn't too hard after all now, was it. :-)

Although the spec is somewhat unclear on this I think is quite in order to
have visible elements nested inside invisible elements. The spec actually
does say the visiblity property specifies whether the boxes *generated by an
element* are rendered. It does not say anything about boxes generated by
child elements, I think they should behave independently.

IMHO the browsers where this 'problem' of yours does not appear are, in
fact, the ones that are broken.

I doubt that you will get any joy over at clj as this is a CSS issue, not a
javascript one. That is why I answered here rather than over there.

If you want these divs to behave the way I think you do then change
mydiv.style.visibility = "visible";
to
mydiv.style.visibility = "inherit";

Cheers
Richard.


 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Old 07-01-2007, 12:23 PM   #5
Hans Börjesson
 
Hans Börjesson's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!

Hi Mark!

I see when I removed the <table> I had in inside my "outer" div also IE
behaves the same way as NN6+ (if you test the html in my original post you
will see that IE will behave in another way). I removed my <table> when I
created the validated sorce code to make the code as small as possible but I
only tested the result in NN6+ and the problem still occured but the problem
was now also the same in IE.


Thanks for letting me know.

Regards
/Hans Börjesson



"Mark Parnell" <webmaster@clarkecomputers.com.au> wrote in message
news:3ef7ebe9$0$11181@echo-01.iinet.net.au...
> Hans Börjesson wrote:
> > Ok here is a validated document then. Still the same problem.
> >

> <snip>
>
> I get the same problem as you do, in both Mozilla and IE. I would

certainly
> say that it is a JS problem, but I can't help you there, I'm afraid.
>
> Good luck with it.
>
> --
>
> Mark Parnell
> http://www.clarkecomputers.com.au
>
>



 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Old 07-01-2007, 12:23 PM   #6
Hans Börjesson
 
Hans Börjesson's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!

Ahh I see! Thanks for a good explanation Richard.

I found out that IE behaved the same way with my validated code (actually I
removed a <table> inside my "outer" <div> that seems to make IE behave
differently. If I "re-add" this table (which you can see in my original
post) in the validated source code IE behaves differently than NN6+.

Once again thanks for pointing me in the right direction.

Regards
/Hans Börjesson


 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Old 07-01-2007, 12:23 PM   #7
rf
 
rf's Avatar
 
Posts: n/a
My Photos: (0)

Banked:
MK Cash: $

I am Worth:
MK Cash: $
Donate

Recent Blog: None

Default Possible to have nested <div> tags!


"Hans Börjesson" <hansb@vendimo.REM.com> wrote in message
news:bd8t8f$j4$1@yggdrasil.utfors.se...
> Ahh I see! Thanks for a good explanation Richard.
>
> I found out that IE behaved the same way with my validated code (actually

I
> removed a <table> inside my "outer" <div> that seems to make IE behave
> differently. If I "re-add" this table (which you can see in my original
> post) in the validated source code IE behaves differently than NN6+.


I suspect because IE has more bugs than a rain forest.

Tables are layed out differently than other elements. I suspect that IE is
saying "I can't be bothered, lets just disappear the whole table, contents
and all".

If two browsers behave differently and one of them is IE then it's a safe
bet the other browser is doing it correctly (unless of course if it's
Netscape 4.x).

On reflection: since the specs are possibly open to interpretation you
should anticipate those interpretations. In this case, pressing "toggle div
1" should disappear both divs, just to be sure (and I assume that is what
you want).

> Once again thanks for pointing me in the right direction.


No problem.

Cheers
Richard.


 
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit!
Reply With Quote
Featured Websites
Free Space
Free Space
Free Space Free Space
Reply
Tags: , , ,




Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Possible to have nested <div> tags! Tim Radford HTML 0 07-01-2007 12:22 PM
Nested HTML Documents Christopher R. Peterson HTML 2 07-01-2007 12:22 PM
how to find nested dupes Jaak Database 3 06-09-2007 11:18 PM
DB_NestedSet, where did my nested set go? Daniel Khan Pear 0 05-20-2007 5:34 PM
'nested conditional' that can identify parent page? Alan Jones PHP 8 05-20-2007 5:33 PM


Featured Websites




All times are GMT +1. The time now is 7:22 AM.


Powered by: vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
LinkBacks Enabled by vBSEO 3.0.0
Cheap Computers
MK PitStop Copyright 2005 - 2008

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98