Im more of a C++ and plain JS type of dude, and I feel absolutely stupid not being able to find this out.
I tried doing this
<button1 id="coolbutton" type="button">
My JSFiddle Account
</button1>
along with this CSS code
button1 {
font-family: Verdana;
color: purple;
background-color: grey;
text-align: center;
text-decoration-line: overline underline;
}
html {
background-color: #666699;
}
body {
background-color: #666699;
}
Not feeling so good about my "Epic Coding Skills" because I feel like it’s easier than I think.
2
Answers
The HTML Living Standard defines what element types exist in HTML (along with a format for naming custom elements.
It defines, for example,
button
andhtml
. It does not definebutton1
, andbutton1
does not meet the custom element format.You have tried to create a
button1
element in your HTML, which is invalid HTML and triggers error recovery in browsers.You have written a CSS type selector to try to select it, and whatever is reporting that error knows you are trying to find an element in an HTML document where
button1
elements are not allowed.Use
id
andclass
attributes to define specific (or groups of specific) elements. Select the type based on the semantics it has. Don’t invent new types.there is no
<button1>
element what you are looking for is simply the<button> </button>
. Do your CSS on the coolButton id (or the id of the button you want to change)