Check out a free preview of the full Calculator Project: HTML & CSS course
The "Calculator Q&A" Lesson is part of the full, Calculator Project: HTML & CSS course featured in this preview video. Here's what you'd learn in this lesson:
Jen discusses class values that take advantage of style rules from multiple classes.
Transcript from the "Calculator Q&A" Lesson
[00:00:00]
>> Jen Kramer: Yeah, Dylan.
>> Speaker 2: Are we allowed to do just dot double and dot triple because the space, it's not hyphenated in the HTML [CROSSTALK] style in CCS, we don't have to do count button triple?
>> Jen Kramer: You could, okay so what I did in the HTML for that let me.
[00:00:20]
>> Jen Kramer: Yeah, I just have a second class here. So I have a class called calc-button and I have a class called double.
>> Speaker 2: But it's because that's the space is not hyphenated, right?
>> Jen Kramer: Correct.
>> Speaker 2: That's correct, okay.
>> Jen Kramer: If I called it calc hyphen, button hyphen, double, that's a completely different class.
[00:00:36]
It would not take on any of the styling of calc-button, I'd have to rewrite all of that. And I'd have to write on the changing the flex-basis. Because I've used two classes here, what we're doing is we are able to take advantage of all the styling that we already put on the one calc-button.
[00:00:54]
>> Speaker 2: Okay.
>> Jen Kramer: Okay, with the flex-basis of 24.5. But now we're overwriting it later in the document, since it's later in the document it takes priority.
>> Speaker 2: I was thinking there is table one class, but I see the space totally.
>> Jen Kramer: Yeah
>> Speaker 2: Two separate and no comma just because that's how it's done.
[00:01:12]
>> Jen Kramer: No comma, that's cuz that's the way it's done.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops