Using the same HTML id attribute over miltiple PHP files

Question

I know that id selector is used to specify a style for a single element. My question is, if I have a project and it has multiple php files, can these php files contain elements with same id?
Here is example:
php file 1:

...
<body>
<h1 id="test">header1</h1>
</body>
...

php file 2:

 ...
<body>
<h3 id="test">header3</h3>
</body>
...

css file:

#test
{
color:red;
}

This usage is correct or not?

score 3 · Accepted Answer · answered Feb 17 '13 at 15:00

If they are all rendered in the same HTML page in the browser, it's incorrect as ID should be unique on a single page. If only one is ever rendered then it'll be a-ok.

If you want your Web pages to validate as XHTML or HTML, then you should have unique IDs on your pages.

score 1 · Answer 2 · answered Feb 17 '13 at 15:01

1

Yes, that is correct. In fact, that is a good idea. If you do that, you can use the same stylesheet on both pages. As long as you don't combine the files, it's a great idea.

answered Feb 17 '13 at 15:01

tckmn

57,719
27
114
156

score 1 · Answer 3 · answered Feb 17 '13 at 15:03

1

What you are doing is fine, but it looks like class is better for what you are trying to do. You typically use ID to specify a specific element on a specific page and class to apply styling to different elements, on the same or different pages.

Using the same ID on multiple pages WILL work, but imo class is the more proper thing to use.

answered Feb 17 '13 at 15:03

Mike C.

3,024
2
21
18

"Using the same ID on multiple pages WILL work, but imo class is the more proper thing to use." But why? What if it really is one and the same across all pages? – BoltClock Feb 17 '13 at 15:07
ID is meant for only one element, class is meant if you're going to apply it to multiple elements. See this http://stackoverflow.com/questions/298607/css-best-practice-about-id-and-class – Mike C. Feb 17 '13 at 16:57
ID is meant for only one element *per page*. There's no rule that forbids you from using the same ID across multiple pages provided you keep it to the same element on each page. – BoltClock Feb 17 '13 at 16:57
Class is meant to apply styles to multiple elements, ID is meant to apply style to a single element. What you are saying is not incorrect, but it's possible to get into a situation where you need to make a change to only one of the elements that you do not want to apply to the others. In this case, you should apply specific changes for just that element using ID and leave the generic styling in the class for all of the similar elements. I would advise against using the same ID across the pages so that you retain the ability to apply element specific styling to a specific element. – Mike C. Feb 17 '13 at 17:03

score 1 · Answer 4 · answered Feb 17 '13 at 15:06

The id should be unique for each element per (HTML) document.

So, unless you combine the output of your PHP files into a single HTML file there is no problem. In page1 your one h1 heading will be red, in page2 your one h3 heading will be read, etc.

Personally, I prefer CSS classes for appearance and DOM IDs for functions, but they can be mixed.

Using the same HTML id attribute over miltiple PHP files

4 Answers4