How do IDs work

If you have the same named ID in two separate files, what happens?

For example…

page_1.html


<body>
	<div id="wrapper">

page_2.html


<body>
	<div id="wrapper">

style_sheet.css


#wrapper{ }

Debbie

The ID is unique on a per (x)html document basis only. So obviously whatever CSS you have will be applied for #wrapper for each page. So let’s say that CSS makes text red then on both pages text would be red for each matching ID respectively but obviously you can only have one ID (with that exact name) per HTML file.

THEY LET U INTO BARS!

==XD

seriously tho.

IDs must be unique. Which means you can use an ID once in a specific document or page ( you can use the same ID once per page through a site, if you wish). You probably noticed that this really doesn’t matter ( if you use an ID in the same way you do a class , you wont notice the difference as far as CSS goes ). However it will fail validation AND more importantly it WILL MESS UP any javascript that relies on ID to target an element.

:rolleyes:

seriously tho.

It wasn’t a dumb question… :mad:

IDs must be unique. Which means you can use an ID once in a specific document or page ( you can use the same ID once per page through a site, if you wish). You probably noticed that this really doesn’t matter ( if you use an ID in the same way you do a class , you wont notice the difference as far as CSS goes ). However it will fail validation AND more importantly it WILL MESS UP any javascript that relies on ID to target an element.

I was asking if it would be okay to have #WRAPPER in ever page or if I had to make it .WRAPPER or #WRAPPER1, #WRAPPER2,…

Debbie

As Robert said an id must be unique inside each individual page but you can use the same id on every page of your site. You just can’t have the same id twice in any one page as then it won’t be unique on that page.

Otherwise we would soon run out of words to use if every page needed different ids:)

And CSS files would become massive!

When you’re looking at page1.htm with <div id=“wrapper”>, there’s no way at all for the browser to know that page2.htm also has <div id=“wrapper”> and calls up the same CSS file … so there’s no way that it could cause any conflict or problem.

Sorry , I couldnt resit the joke earlier… too much sugar.

I think I said this too:

( you can use the same ID once per page through a site, if you wish).

== : )

In short:

  1. IDs can only be used once per page
  2. You ARE ALLOWED to use the same ID on different pages ( documents) throughout the site
  3. SOMETIMES, it may be advantageous to make SOME IDs (or even a class) unique to throughout the entire the site. This is not a requirement for validation, merely a good technique. the neat thing about this method is you can now target items based on the page with the same style sheet!

example <body id=“page_1”>
<body id=“page_2”>
<body id=“page_3”>

#page_3 #menuItem_3 ,#page_2 #menuItem_2,#page_2 #menuItem_2 { Styles for current page item}

True, but it wasn’t clear to me until now.

Thanks,

Debbie

I have been doing both, but wasn’t sure.

I have #wrapper in several pages, but maybe #slideshow only once in my website.

Debbie