Where CSS can exist physically in a HTML file

An id is definitely an HTML attribute that need not have anything to do with CSS.

  1. It defines an anchor point in the HTML that anyone can link to within the page simply by adding the id value after the # on the end of the web address.
  2. It provides a way to link the labels to the fields inside an HTML form.
  3. It provides the simplest way to reference a particular tag in the HTML from JavaScript.

That it can also be used from CSS is just an extra benefit this HTML attribute provides


Thank you, @ronpat. As for my multiple posts, part of the problem is that I did not initially realize there were so many replies. The other problem is that (unlike other sites) the features for quoting are not visible until I create a reply. I now know where they are but previously I just forged ahead with separate replies.

[quote=“ronpat, post:18, topic:219020”]
If you consider this part of his statement to be superfluous…
[/quote]Yes, that part of @SamA74’s reply was discouraging. The important thing is that no one has said anything about CSS existing elsewhere. So unless I misunderstand something, the answer probably is simply that I have identified all the possibilities, there are no other places that CSS can exist physically in the body.

People are making the question so complicated. I tried to limit the question. When I say “physically”, I mean syntactically (and maybe semantically), not logically, as in how it is used. I am asking only about what might appear in the specifications of CSS. You could also call it scope. The issue seems very simple to me. I just want to ensure I understand the scope of CSS.

[quote=“Mittineague, post:19, topic:219020”]
I think what you are getting at is specificity.
[/quote]I think what you are getting at is the use of CSS instead of the syntax of it.

[quote=“SamA74, post:20, topic:219020”]
The class attribute is very important in the use of css. But I would not consider it to be css ‘within the body’ it is a html tag.
[/quote]I think that is differences of terminology.

[quote=“SamA74, post:20, topic:219020”]
They are just the things that join the css and html together, allowing you to keep the two separate.
[/quote]If the class attribute is useless without a corresponding CSS class then the class attribute is within the scope of CSS.

[quote=“SamA74, post:20, topic:219020”]
The general message is to avoid putting any css in the body.
[/quote]You just don’t get it.

[quote=“SamA74, post:20, topic:219020”]
which you say you are not interested in
[/quote]Because best practices and personal preferences is not relevant.

[quote=“SamA74, post:20, topic:219020”]
is is a broad subject
[/quote]No, the CSS language is very simple in this context, as I indicated previously in this post.

[quote=“felgall, post:21, topic:219020”]
An id is definitely an HTML attribute that need not have anything to do with CSS.
[/quote]Yes the id attribute is confusing.

I am not aware that anyone was counting.

That is not exactly correct. As I said in my post, [quote=“ronpat, post:18, topic:219020”]
To quote a selection of text from a previous post, highlight the text in that post with your mouse, then click the gray “Quote Reply” button that appears just above the top left corner of the highlighted text (screenshot attached). A new post will be opened and the quoted text will be added to the top of the new post, OR it will be added at the last place you clicked your mouse within the body of a new post that you have already started or a post that you may be editing.
Some new members find that information by reading our posting guidelines, some do not.
It’s part of the learning curve associated with any new application, device, or forum. We repeat what we must to help the member learn how to use Discourse and Markdown. No biggie (up to a point, of course).

Why? It was just a little additional information. Yours to read or ignore. His first, shorter sentence was the key that answered your question precisely and concisely…

Which answers your question perfectly and without elaborating about “usage”.

I am not so sure about that. In the paragraph that I just quoted, you mentioned other expressions that are supposed to be equivalent to your use of the word “physically”. I will argue that if you can use other words that express your question more clearly, then you have overcomplicated the question by being unintentionally ambiguous. Communication IS a two way street and perfect grammar does not always assure perfect communication. (I’m sure you know that.)

Sam said[quote=“SamA74, post:20, topic:219020”]
The class attribute is very important in the use of css. But I would not consider it to be css ‘within the body’ it is a html tag.
[/quote] Sam is 100% correct. “class” is an HTML attribute, just as “id” is an HTML attribute, just as “style” is an HTML attribute. They are not CSS nor “CSS within the body”. Those HTML attributes exist within the HTML lexicon for specific purposes. (Here is where you have to have a token of appreciation for their use.) If there is a terminology misunderstanding, it is yours.

The HTML class attribute exists to hold one or more classNames. Those classNames can be targeted by CSS or JS. Similarly, the HTML id attribute exists to hold one idName. That idName can be targed by CSS and JS. It can also be the target of a fragment identifier.
Repeating: The HTML attributes “class” and “id” exist to hold targets used by CSS, JS, or links.
Repeating: The HTML attribute “style” exists to actually hold inline CSS within the body of the page.

Please consider this… if classNames and idNames were considered CSS because CSS can target them, then every HTML element would have to be considered CSS because CSS can also target HTML elements without classNames or idNames. Elements are just a broader target.

After considering what I have written in this post and reconsidering what others have written in this thread, please explain why the HTML id attribute is confusing and one of us will attempt to address that issue.


Nothing I am asking about affects what I do. I am only asking about CSS as it exists, everything and anything saying what I could do or should do is not relevant.

I believe that is where we left off in this conversation.

Please refer to the post that I replied to with my comment. I did not explain because the answer already exists.

Please refer to 5.8.3 Class selectors of the Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification. Sure, that is not the latest version of CSS but it is good enough for here. It describes the class attribute. It says nothing about JavaScript, right? Is there anything in a standard anywhere that says that the class attribute can be targeted by JavaScript?

That is not a standard. You know that actually, there is no standard for JavaScript, Standard ECMA-262 is the ECMAScript® 2016 Language Specification. It says nothing about getElementsByClassName. The getElementsByClassName function is part of the HTML DOM specification, as in W3C DOM4. There is nothing in the ECMAScript or even JavaScript syntax that supports use of the class name, other than as a literal, right?

The DOM specification does not use the term “CSS” to qualify what a class name is but classes in class attributes never refer to an ECMAScript or even JavaScript object. ECMAScript and JavaScript have no specialized feature for the classes existing in class attributes

That is the standard for that part of JavaScript when it is running inside a web browser. The site I posted simply combines documentation on the two parts of the JavaScript standard - both the EcmaScript part and the DOM part.

Mozilla is not a standardizing organization. There is no such thing as a JavaScript standard. You need to understand that, otherwise we will be unable to communicate due to incompatible understandings.

See JavaScript | MDN wherein Mozilla says that “The standard for JavaScript is ECMAScript” and see JavaScript language resources - JavaScript | MDN wherein Mozilla says “ECMAScript is the scripting language that forms the basis of JavaScript. ECMAScript is standardized by the ECMA International standards organization in the ECMA-262 and ECMA-402 specifications.”.

From what I can see from looking at complex documentation very quickly

https://www.w3.org/TR/DOM-Level-2-HTML/html.html circa 2000
Mentions class used by CSS and user-agents, but not JavaScript.

https://www.w3.org/TR/dom/ circa 2015
Has quite a bit about JavaScript as does

https://dom.spec.whatwg.org June 10 2016

TBH I can’t recall exactly when getElementsByClassName had enough browser support for me to consider using it instead of “id”

For some reason I’m thinking it was around the same time as querySelector

in any case, querySelector has been a thing from at least 2013

and if my memory serves, getElementsByClassName for at least about as long.

I included it when writing the third version of my JavaScript tutorials in 2009 so it must have been available in at least some browsers for at least a couple of years before that.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.