Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.javascript > #12428

Re: CSS Use of ID

From Norman Peelman <npeelmandog@cfl.rr.com>
Newsgroups comp.lang.javascript
Subject Re: CSS Use of ID
Date 2012-03-06 06:40 -0500
Organization A noiseless patient Spider
Message-ID <jj4t42$nq9$1@dont-email.me> (permalink)
References <qhabl79jrmuqqhda7kvu7mce8me5n9aoe9@4ax.com>

Show all headers | View raw


On 03/06/2012 01:15 AM, Gene Wirchenko wrote:
> Dear JavaScripters:
>
>       Is the issue of avoiding using the same id more than once but
> using a special CSS item really just solved with using a class instead
> of id?
>
> Sincerely,
>
> Gene Wirchenko

Gene,

   You can refer to the same id as much as you need in your css 
declarations:

<style type="text/css">
   div {
	color:red;
	border-top:2px solid red;
	border-left2px solid blue;
   }

   p {
	color:white;
   }

   div {
	border-bottom:2px solid green;
	border-right:2px solid yellow;
   }

   p {
	border:1px dashed orange;
   }

   div {
	border:4px ridged purple;
   }
</style>

...for example. The changes are additive. In this rather boring useless 
example, the final 'div' declaration overwrites the previous border 
assignments but leaves the color property alone. This is how you group 
css declarations together while still being able to make alterations at 
a finer level:

<style type="text/css">
   H1, H2, H3, H4, H5, H6
   {
     color:black;
     border:none;
     margin:0,50%,0,50%;
     padding:0;
   }

   H3
   {
     color:white;
     background-color:black;
   }
</style>

...here H3 keeps the border, margin, and padding values from the first 
declaration but color is changed and background-color is added.

   That being said, you do not want to reuse the same 'id' in your HTML 
declarations. That is what can make browsers go goofy.

...HTML...

<div id='left_col' class='red'>
   blah blah blah
</div>
<div id='left_col' class='blue'>
   blah blah blah
</div>

...

is what you are trying to avoid. It may work here and there, but results 
aren't guaranteed. The bottom line is that in CSS you CAN and WILL use 
the same id from time to time, it's perfectly legal and that's exactly 
how it's supposed to work. You should AVOID reusing the same id in HTML, 
it's not illegal but it is rather pointless.

-- 
Norman
Registered Linux user #461062
AMD64X2 6400+ Ubuntu 10.04 64bit

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread


Thread

CSS Use of ID Gene Wirchenko <genew@ocis.net> - 2012-03-05 22:15 -0800
  Re: CSS Use of ID "Evertjan." <exjxw.hannivoort@interxnl.net> - 2012-03-06 10:04 +0000
    Re: CSS Use of ID "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2012-03-06 12:37 +0200
      Re: CSS Use of ID Scott Sauyet <scott.sauyet@gmail.com> - 2012-03-06 04:24 -0800
        Re: CSS Use of ID "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2012-03-06 15:21 +0200
      Re: CSS Use of ID David Mark <dmark.cinsoft@gmail.com> - 2012-03-12 17:09 -0700
  Re: CSS Use of ID Norman Peelman <npeelmandog@cfl.rr.com> - 2012-03-06 06:40 -0500
    Re: CSS Use of ID Gene Wirchenko <genew@ocis.net> - 2012-03-06 11:27 -0800
      Re: CSS Use of ID Denis McMahon <denismfmcmahon@gmail.com> - 2012-03-07 01:49 +0000
      Re: CSS Use of ID Norman Peelman <npeelmandog@cfl.rr.com> - 2012-03-06 23:13 -0500
        Re: CSS Use of ID Gene Wirchenko <genew@ocis.net> - 2012-03-06 22:32 -0800
  Re: CSS Use of ID Scott Sauyet <scott.sauyet@gmail.com> - 2012-03-06 04:36 -0800
    Re: CSS Use of ID Gene Wirchenko <genew@ocis.net> - 2012-03-06 11:29 -0800
  Re: CSS Use of ID Ross McKay <au.org.zeta.at.rosko@invalid.invalid> - 2012-03-07 11:58 +1100

csiph-web