Adding Math Buttons

[00:00:00]
>> Jen Kramer: We've got the easy rows done, right? Those are the ones with four things in them. So let's go and take a look at this one here, the one with three things in it. So clearly, what is the difference between that row, this C, backspace, division versus the 7, 8, 9 times row?

[00:00:21]
What is the difference between them?
>> Speaker 2: One of your buttons spans two columns.
>> Jen Kramer: One of the buttons has to span two columns, correct? But are they all still buttons?
>> Speaker 3: Yes.
>> Jen Kramer: They're all still buttons, okay? So what we should do then for that first row, we're just gonna have three buttons instead of having four, correct?

[00:00:45]
We'll go ahead and copy that.
>> Jen Kramer: We can paste those buttons in place.
>> Jen Kramer: Change what they are, so one button is gonna say C. One button's gonna say divide, right? Look up our divide code, so it's just divide. So &divide, okay. And this middle button, you're going to need the other web page that I mentioned here in the notes.

[00:01:22]
So the one about arrows, same website, but it's the one about the arrows.
>> Jen Kramer: Look at that, there's an arrow right there, that one looks pretty good. And so you can go ahead and copy the code for that, which is &larr, L-A-R-R, and put that code in place.

[00:02:14]
>> Jen Kramer: Okay, so the C, though, that button is twice the size of the others, correct? That one's spanning two columns. And so we're going to need a way, probably another class, right, to differentiate that button and the way it looks from the other buttons, true? That's a reasonable thing to do.

[00:02:34]
So what I'm going to do here for this next button, here in calc button, let's go ahead and give this a second class of double. I've seen some people online doing this. You can have a lot of classes applied to the same thing in your document. You don't have to have a single class per HTML element.

[00:02:56]
If you want to use multiple classes, you're going to have a single class attribute. So in other words, you don't say class=, class=, class=. That will not work. Say class=, and then you're gonna put both class names here inside, all right? So in this case, it's gonna say calc button.

[00:03:15]
And I've added this class of double because I want it to go over two columns. So it's a double width button, that's how I came up with that name.
>> Speaker 2: So even though it's one string, the space means that it's considered two things.
>> Jen Kramer: It's considered two things with the space in between.

[00:03:32]
Yeah, no commas. It's a space this time. And I am sorry, [LAUGH] welcome to the wonderful world of computer science