Style sheet question: difference between div#score vs. #score
in [CSS]
|
Prev: Style sheet question
Next: Emulating <PRE>
From: A. Deguza on 29 Mar 2010 20:25 On Mar 28, 11:36 pm, "Jukka K. Korpela" <jkorp...(a)cs.tut.fi> wrote: > A. Deguza wrote: > > Thanks for your response Chris, but I may not have posed my question > > properly. > > Well, you did not give a hint of the topic in the Subject line (all > questions in this group are supposed to be about style sheets), and you > started with irrelevant things, but the question itself was fairly clear: > "Why have a "div" before "#name"?" > > On the other hand, this is a frequently asked question, and by reading the > group for a while or checking the past discussions, you would have found the > answer relatively fast (and would probably have learned that constructive > posting style does not quote entire messages, only the relevant parts). > > > In the CSS sheet I see: > > > div#scores { > > position:relative; > > width: 700px; > > height:280px; > > overflow:no; > > } > > Even from that fragment, we can see that the author hasn't used the > available tools for checking that CSS code is at least formally correct. The > overflow property has four defined values: visible, hidden, scroll, auto. > This means that you should not expect other things in the style sheet to be > exemplary either. > > > <div id="scores"> > > > What is the function of that "div" in "div#scores" in the CSS sheet? > > Formally, it is part of a combined selector and thereby restricts the > selector to refer to div elements only. In a sense Chris is right in saying > that this means div#scores, unlike mere #scores, does not refer to an > element like <ol id="scores">. But this is probably an unexpected effect of > a mistake rather than planned feature. > > More often, div#scores is used intentionally to give the selector higher > specificity. If you have > #scores { font-size: 80%; } > in one style sheet and > div#scores { font-size: 100%; } > then the latter "wins", no matter what the mutual order of the stylesheets > is. > > -- > Yucca,http://www.cs.tut.fi/~jkorpela/ Thanks Yukka. So, "div#scores" is similar to the expression "#scores div" that I see? BTW, you must be a professor! Your writing style is similar to what our professors use to write on our papers... Arturo
From: Thomas 'PointedEars' Lahn on 29 Mar 2010 21:51 A. Deguza wrote: > "Jukka K. Korpela" wrote: >> More often, div#scores is used intentionally to give the selector higher >> specificity. If you have >> #scores { font-size: 80%; } >> in one style sheet and >> div#scores { font-size: 100%; } >> then the latter "wins", no matter what the mutual order of the >> stylesheets is. > [...] > > So, "div#scores" is similar to the expression "#scores div" that I > see? Similar only by a very wide margin. `div#scores' matches the `div' element with ID `scores'; `#scores div' matches the `div' element that is a *descendant* of *another* element with the ID `scores'. RTFM: <http://www.w3.org/TR/CSS/selector.html> > BTW, you must be a professor! Your writing style is similar to what > our professors use to write on our papers... Your writing style, on the other hand, does not fit any such category ... Please trim your quotes to the relevant minimum, don't quote signatures. PointedEars -- Use any version of Microsoft Frontpage to create your site. (This won't prevent people from viewing your source, but no one will want to steal it.) -- from <http://www.vortex-webdesign.com/help/hidesource.htm> (404-comp.)
From: David Stone on 30 Mar 2010 10:58 In article <42b42c19-0bee-4348-81f0-f20f8bc6c7a4(a)g28g2000yqh.googlegroups.com>, "A. Deguza" <deguza(a)hotmail.com> wrote: > On Mar 28, 11:36 pm, "Jukka K. Korpela" <jkorp...(a)cs.tut.fi> wrote: > > A. Deguza wrote: > > > Thanks for your response Chris, but I may not have posed my question > > > properly. > > > > Well, you did not give a hint of the topic in the Subject line (all > > questions in this group are supposed to be about style sheets), and you > > started with irrelevant things, but the question itself was fairly clear: > > "Why have a "div" before "#name"?" > > > > On the other hand, this is a frequently asked question, and by reading the > > group for a while or checking the past discussions, you would have found the > > answer relatively fast (and would probably have learned that constructive > > posting style does not quote entire messages, only the relevant parts). > > > > > In the CSS sheet I see: > > > > > div#scores { > > > position:relative; > > > width: 700px; > > > height:280px; > > > overflow:no; > > > } > > > > Even from that fragment, we can see that the author hasn't used the > > available tools for checking that CSS code is at least formally correct. The > > overflow property has four defined values: visible, hidden, scroll, auto. > > This means that you should not expect other things in the style sheet to be > > exemplary either. > > > > > <div id="scores"> > > > > > What is the function of that "div" in "div#scores" in the CSS sheet? > > > > Formally, it is part of a combined selector and thereby restricts the > > selector to refer to div elements only. In a sense Chris is right in saying > > that this means div#scores, unlike mere #scores, does not refer to an > > element like <ol id="scores">. But this is probably an unexpected effect of > > a mistake rather than planned feature. > > > > More often, div#scores is used intentionally to give the selector higher > > specificity. If you have > > #scores { font-size: 80%; } > > in one style sheet and > > div#scores { font-size: 100%; } > > then the latter "wins", no matter what the mutual order of the stylesheets > > is. > > > > -- > > Yucca,http://www.cs.tut.fi/~jkorpela/ > > Thanks Yukka. > > So, "div#scores" is similar to the expression "#scores div" that I > see? Similar but not the same. div#scores would match the html element <div id="scores">...</div> #scores div would match, for example, the inner div(s) in the following, but would not affect the element with id="scores" itself: <body id="scores"> <div>...</div> </body> <div id="scores"> <div>...</div> <div>...</div> </div
From: Randal L. Schwartz on 30 Mar 2010 14:12 >>>>> "David" == David Stone <no.email(a)domain.invalid> writes: David> <body id="scores"> David> <div>...</div> David> </body> David> <div id="scores"> David> <div>...</div> David> <div>...</div> David> </div Of course, that wouldn't be possible within one document, since IDs are required to be unique. -- Randal L. Schwartz - Stonehenge Consulting Services, Inc. - +1 503 777 0095 <merlyn(a)stonehenge.com> <URL:http://www.stonehenge.com/merlyn/> Smalltalk/Perl/Unix consulting, Technical writing, Comedy, etc. etc. See http://methodsandmessages.vox.com/ for Smalltalk and Seaside discussion
From: David Stone on 30 Mar 2010 15:21
In article <8639zh1xwn.fsf(a)red.stonehenge.com>, merlyn(a)stonehenge.com (Randal L. Schwartz) wrote: > >>>>> "David" == David Stone <no.email(a)domain.invalid> writes: > > > David> <body id="scores"> > David> <div>...</div> > David> </body> > > David> <div id="scores"> > David> <div>...</div> > David> <div>...</div> > David> </div > > Of course, that wouldn't be possible within one document, since IDs > are required to be unique. I thought that was obvious from the preceding posts in the thread... |