From the course: Design the Web: Styling a Table

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Styling the table footer

Styling the table footer - phpMyAdmin Tutorial

From the course: Design the Web: Styling a Table

Start my 1-month free trial Buy for my team

Styling the table footer

“

- [Voiceover] Now, before add any additional styling, such as hover states and styles for the first column, let's take a few minutes and take care of styling the footer. So in the CSS file, let's come in here, let's copy our table#planets. Let's hit a few returns. Let's paste that after all of our table body rules. Then a space. Then we'll type tfoot. Then a space. Put in our brackets. For the main footer element, we're gonna set a font size to .8 ems, this will be 20% smaller than the base font. So in the preview area, we can see that showing up here. Now, next we'll target the table row. We're gonna add a border top, so we can separate the footer from the body content. So in the next line, table#planets, hit a space. Tfoot, space, tr for table row. Put in our brackets. We're gonna set a property of border top. For the width, we're gonna set this to 2 pixels, then a space. Style's gonna be solid, and then for the color, I wanna use the same color as the background of the header area.…

Contents