2

What's the deal with spaces in class names? I was told in my courses that they cannot contain spaces. And yet I'm seeing on the website, that it has space name within a class. Are those 2 separate classes button1 and writeTo combined within the quotes?

<a href="#" class="button1 writeTo" data-nick="Bobby">Send a Message</a>

Also I'm seeing weird classes that end with spaces like such: "Marry ". Do those spaces get elminated or are they a part of the class?

3
  • they are 2 different classes, and this is why you can't have a space in the middle of your class name (otherwise it will bee interpreted as 2 classes)
    – Alberto
    Commented Nov 24, 2019 at 0:16
  • Classes are space separated values. Elements can have many classes.
    – zzzzBov
    Commented Nov 24, 2019 at 0:17
  • 1
    Duplicate of How to assign multiple classes to an HTML container? Commented Nov 24, 2019 at 2:18

3 Answers 3

1

Spaces are used when adding another/extra class name. When you prepare html and css codes, you may want to write less code. In this case, you can set general rule for elements with the same characteristics. For example;

.box{
height: 300px;
width: 300px;
color: white;
}
.black{
background-color: black;}
.red{
background-color: red;
}
<div class="box black">Black Box</div>
<div class="box red">Red Box</div>

These elements have same height, same weight and same text color. These features are gathered/stored in the box class name. But background colors is different, so its properties are written separately.

0

When you want to set multiple classes on a tag you have to separate them with spaces. So in your example, your link would have two classes: "button1" and "writeTo" instead of only one called "button1 writeTo".

When you see in sites that configuration that's because the person who built it wanted to add more than one class to the element.

0

Using spaces in the class attribute is a way to add multiple classes. For example class="class1 class2 class3" means that the element is affected by class1, class2 and class3. You can see an example here: https://www.w3schools.com/html/tryit.asp?filename=tryhtml_classes_multiple and you can read more about classes here: https://www.w3schools.com/html/html_classes.asp. You might also want to finish learning the whole chapter before asking these types of questions ;)

Not the answer you're looking for? Browse other questions tagged or ask your own question.