homepage Welcome to WebmasterWorld Guest from 54.196.159.11
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
need help understanding the DIV Element
aeramas




msg:4037549
 5:51 am on Dec 5, 2009 (gmt 0)

I did a quick search on the web and couldn't find an exact answer to this question. W3C.org changed and I couldn't find what I was looking for there, so here it goes.

When using multiple <div> statements, and you close one, what is the order it closes?

here is an example:
css reference

body{text:12px; color: black;}
div.1{color: red;}
div.2{color: blue;}
div.3{text:10px;}

<body>
<div id=1><div id=2><div id=3> ABC </div> XYZ </div> 123</div>

In this statement is ABC red or blue and size 10? Is XYZ black and size 12 or red size 10?

 

tedster




msg:4037566
 6:57 am on Dec 5, 2009 (gmt 0)

ABC is blue size 10
XYZ is blue size 12
123 is red size 12

XYZ is still blue because it's still within div#2. But it's not within div#3 which is closed - so it is size 12, not 10.

By the way, I assumed you meant div#1 and not div.1
Also note, it is not a good idea to begin a class or ID name with a numeral. Older versions of IE will (incorrectly) forgive it but not other browsers.

aeramas




msg:4037580
 8:41 am on Dec 5, 2009 (gmt 0)

Thank you, I appreciate the help. I did not know about the older browsers not liking class/id starting with numbers either. I usually name them something relevent anyway.

aeramas




msg:4037582
 9:14 am on Dec 5, 2009 (gmt 0)

one more question concerning this, a little bit more complicated. My site is setup something like this.

index.php

<?php require('header.php');/?>

My Content

<?php require('footer.php');/?>

header.php

<head>
<style>
body{text:12px; color: black;}
div#1{color: red;}
div#2{color: blue;}
div#3{text:10px;}
</style>
</head>

<div id="2"><img src="logo">
<br><br>
<a href="contact.php">contact us</a>
<a href="products.php">products</a>
<br><br>
I am writing this as as example
<br><br>

contact.php

<div id="1">
My name is Aeramas
(555)555-1234
Dallas Texas
</div>

note: <div id=2> in the header is still open. Does that make the content on index.php in the body black size 12? or Blue size 12?

tedster




msg:4037776
 6:15 pm on Dec 5, 2009 (gmt 0)

You may be running into issues around CSS specificity [google.com] - which bothers me and most everyone I know from time to time. The link I gave points to our Site Search results on the topic - and it's worth some time getting up to speed. In short, there are complex rules in CSS about when one rule overrides another.

But the general answer is still, if the div is open then its rules are in effect - however some other specificity factor may also be in play in any particular situation.

aeramas




msg:4039964
 8:48 am on Dec 9, 2009 (gmt 0)

Thanks, I appreciate your help Tedster

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved