Multiple ID's in a Div

HTML & CSS
1

I have multiple ID’s in a div tag - But dreamweaver doesn’t like the multiple tags.
What’s best way to combine these two id’s?

2

An example, please, as you probably use words in your question in a wrong way.

3

You cannot have multiple IDs for a single div tag.

This works:

<div id="one">some content</div>

This is not allowed:

<div id="one two">some content</div>
4

There is never any need for multiple ids on the same tag since ids are unique either one would serve to uniquely identify that specific tag provided you first get rid of the other id which is stopping things working.

You may need to do a global change on all references to the deleted id in the HTML, CSS, and JavaScript to change the references to the id you kept.

5

Probably the better way; is to combine the data and rewrite the CSS and create a single ID that covers both of what the other two did. Else consider if you wrote a new ‘Class Selector’ rather than ‘ID Selector’; if its “specificity” would be of a high enough value to replace the relevant applied CSS values.

You could however, have multiple classes on the DIV, which may or may not solve your problem.

I’d have explained this better but my keyboard and mouse are on their ‘last legs’ and want vaporising and replacing by the end of this week… as they are being a complete pain to edit with. So accept my apologies it it’s too hard to follow what I meant, etc.

6

And to take it one step further, you can have multiple classes and an ID on an element.

7

I use this technique quite a lot. :slight_smile:

8

Welcome to SitePoint, Ezas.

How did he “use words … in a wrong way”? I thought his question was quite clear.

9

He’s mixing them up: multiple ID’s then multiple tags. Not knowing the lingo makes his explaining blurry. An actual example would shed light on the actual problem. Notice he/she did not reply. I guess that’s the reason.

10

Hmm, the OP probably just transposed ID with ‘tags’ it was probably supposed to read - […] doesn’t like the multiple [ID’s on] tags.

Anyway, we’ll assume the issue has been fixed unless they come back and say else-wise.

11

Ok, from what i gather he has a (single) tag which he wants multiple ids.
something that would look like this < div id=“name lastname someother”>

Ezas, this is just simply not possible… not even you were hand coding. It’s also not logical. Think about it an ID… defines something as a UNIQUE thing…(as has been said before). Thus, like the "highlander’, There can be only one. Also if you try sticking multiple IDs on tags, it would confuse any javascript you may have (this i know from noob experience)

OK, so what you have to ask yourself is WHY do I need multiple IDs?
If the answer is for CSS styles
then you can :

  1. use a class instead, which btw you can have MULTIPLE CASSES AND AN ID
  2. If that’s not what you fancy… you can split the CSS rules amogst the IDs ( think IN REVERSE)

example, in your CSS
#name ,#lastname ,#someother{display block;}
#name ,#lastname {font-weight:bold; }
#someother #lastname { color:gray;background black;}
#name {color:red; background-gray}
SO that:

the ID = name will be a block element with red bold text on a gray background;
the ID = last name will be a block on a black background with bold gray text
the ID= someother will be a block on a black background with normal gray text

by now you should be thinking wait i should just use a CLASS instead… and I would be saying YES, for ease of comprehension, YOU SHOULD. :slight_smile: . But this will work just as well as far as the browser is concerned.

  1. if its for JAVASCRIPT
    As in the case of targeting via GetElementByID… trully, the PROPER way would be to map the DOM, searching for class or tags. But since I am giving workarounds to suit the method and NOT best practice, try using a an array.

that is since what you wanted was your script to target SEVERAL divs with an ID do a FOR LOOP with all the elements of an ARRAY containing the IDs of the DIVS you want to target.

Targets=new Array(“name”, “lastname” “someother”);
for ( var i in Targets )
{
Dowhateverwith( Targets[i] );
}

this will target ANY element with ANY ONE of the three IDs…

Hope that helps a little

12

You left out the other uses for the id.

3 As an HTML anchor point

where it can be linked to using <a href=“#idvalue”> or <a href=“page1.htm#idvalue”>

  1. As a section label

for example <div id=“header”> as a substitute for the proposed header tag from HTML 5