Uneven Tables in HTML: Part 3

Video Transcript

"So we've been working on building a table with an odd amount of cells and we are about to the end. What we've done so far is created our first table row and it got two cells in it. The first cell being 50 pixels wide and the second cell being 150 pixels wide. And now what we want to do is to create a table row that spans both of those columns on the second line, and we'll do that by doing this, and we'll start with the table row, TR, and do our table column, TD, and go ahead and define our width; okay, TD, define our width as the whole 200 pixels, the whole stretch. And then our height is 150, which is the remainder of the column. So this is going to be a 3 cell table. And this is the important part to this, we want to define our column span, which is other words col span, and this is what's telling the browser that this particular row is spanning the two columns above it. So we want to set our col span to 2, that way it'll go clear across the both columns that are above it. And I think that's it. We're going to do an end bracket there, and then we'll close up our table, save, go up here; well we set the wrong color for one of them. Let’s take this second color and do, well that changed to white. Oh, I forgot to define my last column color, so let’s go ahead and do BG color =, let’s do- there we go. This first one is white, so you can't really see it at the moment. But we got a square here, a larger rectangle here, and then a even a larger cell that spans these two columns. And if you want me to change this to black so it's easier for you to see, try it this way. And that's how we come up with an odd number table."