From the course: CSS Shorts

Unlock this course with a free trial

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

Photo gallery, part 2

Photo gallery, part 2 - CSS Tutorial

From the course: CSS Shorts

Start my 1-month free trial Buy for my team

Photo gallery, part 2

“

- [Chris] Hi this is Chris Converse, and welcome to part two of this two part episode on creating an interactive photo gallery with HTML and CSS. Now we'll be continuing our project by adding some CSS that will react to the states of the radio buttons that we added in part one. And this will allow us to change the gallery based on which thumbnail was selected. Now if you're following along we're continuing from the exercise files from part one. So in part one we added these radio buttons here inside of the section with the class of gallery. We put a unique id on each one, and then we hooked those into the label elements inside the nav by using the for attribute. So now we can start to create some CSS to make the gallery interactive. So let's go back to the exercise files and let's open up the file called style.css in our text editor. And so now inside of the CSS file let's scroll down to the bottom. At the end let's add in a CSS rule that will hide the radio buttons. So I'll type…

Contents