Join James Williamson for an in-depth discussion in this video Controlling gallery styling, part of Applied Responsive Design.
Our gallery is in place, but it doesn't look all that great yet, as you can see here.…So let's take a moment and write the general styling for our gallery, keeping in mind that…we need the gallery to be responsive as well.…So to work on this, I'm going to go and open the Philadelphia.htm file found in 04_06 folder.…So, this is the gallery that we structured in our previous exercise and this is what…I am going to be previewing up in my browser. But in order to do the styling of course,…I am going to have to open up the main.css file, and that can be found in _css directory,…in the 04_06 folder.…
Now, we have a lot of CSS to add here, so as we have in some of the previous exercises,…I am simply going to paste the code, a snippet a code into the CSS file, and then kind of…go over what the code is doing. So in order to write the same selectors as me, just pause…the video, kind of write down what you see there, and then I will go over what's going…on there. And that will just save us a little bit of time and still give us a nice thorough…
- Creating mockups
- Structuring page regions
- Defining default styles and media queries
- Building desktop, tablet, and mobile layouts
- Structuring and styling menus
- Dynamically replacing menus
- Creating a responsive image gallery
- Adding phone functionality
- Testing responsive sites
Skill Level Intermediate
1. Planning Responsive Designs
2. Building Responsive Layouts
3. Responsive Navigation
4. Creating Responsive Media
5. Enhancing Sites for Mobile
6. Managing Resources
Additional resources4m 10s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.