How many id can i use inside one div

Hi everyone,

I want to know how many ID can i use inside on Div



Thank s in Advanced

 

You can only use one ID per DIV (hence, it's a unique box, for multiple instances use class instead of ID).

 

You can only use one ID pet Div, but you can use an ID and a Class together, and you can use more than one Class per Div.

 

Id used only for once insted of id you can use class which have multiple sharing function.

 

Per DIV? NO! -- per PAGE. ONE PER PAGE!!!

ID's are unique identifiers that should only be used once per PAGE. You want multiples, as others have said that's the job of the class attribute.

Goes with the reasons to use ID's -- like targeting one specific element in javascript with document.getElementByID or in an anchor with the href attribute and #.

 

Yup deathshadow is right. You can use the ID only once per page. You can use the class for multiple times, but the IDs denote that the element is unique and its properties too.

 

There is only one id can be used within a DIV

 

Both Goku & Deathshadow are correct. Use only one ID per page! You will also not validate and in some cases it could even cause errors. You can use multiple instances of classes and even have multiple classes on an element (text, image, etc.-items you are styling).

 

Actually -- WAIT, do you mean INSIDE or ON. You can only use one ON a tag... since tags go inside other tags, you can use as many as you like -- so long as they are unique per tag they're ON.

Again, language is everything. As the immortal snarky content from a grade school teacher goes: I dunno, can you go to the bathroom?

 

Once per page.

But i think that of you use more times the same, its ok for browsers but the w3c validator shows error.

 

As DS said, your entire page can be one div (with an id), and everything on that page (which will be inside that div) that has an id property can have its own id. So you could have thousands of ids in one div. Don't know why you'd want to, though.

 

You can use one ID in a Div, ID decide the main structure of the whole Div. But you can use the Class many times as you wish.

 

Can I put a similar question?

How can I declare a div inside a div.
For example I am using grids, but how can I declare that the background from .grid_6 for example, it must be red in background. Because if I am saying :
.grid_6 {background-color:red;} it will get all the grids 6.

How can I specify without modifying the GRID CSS and only by HTML and style CSS that I want to modify that grid_6 in particular?
I am trying something like declaring:
<div class="grid_12" id="test"> in HTML and then in CSS: .grid_12 #test
But it is not working.
Please help !!!

 

In css: #test

Since you can only have one element with any given id, #test refers only to that div.

 

Thank you for the reply. By doing so, does it means:
- I am using an extra Div that will inherit the properties of .grid_12 right? So it will be defined in width by the containing class div?
- Is i t a good practice to make an id div inside a class div like so, just to specify the containing elements?

Thank you kindly

 

You are failing to grasp how selectors work -- though that might come from trying to use some off the shelf grid framework nonsense, since they quite often defeat the point of using CSS in the first place through the use of presentational classes.

If you said:
.grid_12 #test {}

that is referring to a DIV#test inside a DIV.grid12 -- which is NOT what your markup is. You don't have them IN it, you have them ON it -- BIG difference.

This would be IN it:
<div class="grid_12"><div id="test">

For what you were trying for markup, it would be:
#test.grid_12 {}
or
.grid_12#test {}

No spaces means they are both ON the same property -- When you put a space between them you are targeting elements INSIDE it, not the same element.

See a menu:

<ul id="mainMenu">
	<li><a href="/">Home</a></li>
	<li><a href="/forums">Forums</a></li>
	<li><a href="/contact">Contact</a></li>
	<li><a href="/about">About Us</a></li>
</ul>

Code (markup):

#mainMenu -- targets the UL
#mainMenu li -- targets all LI inside #mainMenu
#mainMenu a -- targets all A inside #mainMenu

Which is why if you see re-re's (like the idiots at wordpress) slapping the same class on all the child elements on something like a menu over and over -- well, I lack the words in polite company.

But as Rukbat implied but didn't quite come right out and say, since ID's always trump classes there is no reason to say the class if you just want to target the ID... as such:

#test {}

Would also be functionally identical to .grid_12#test in the majority of circumstances... and if it isn't, IMHO that probably means broken and/or half assed site building methodologies in all but the rarest of cases.