Join Jen Kramer for an in-depth discussion in this video Solution: Create a grid, part of Up and Running with Foundation 4.
- View Offline
- Exercise Files
Alright everybody, how'd you do? Hopefully you did great work. …Now, of course, as you took a look at my design, you didn't know exactly how wide …things were and so forth. But if you got the proportions more ore …less correct, I take that as a perfectly correct answer. …As always, there are lots of different ways to do the same thing in technology, …so this is one possible solution. If your solution looks pretty similar to …mine, as far as I'm concerned, you got it right. …So, here is my solution, I'll talk you through it.…
First of all, I took that h1 and I put it in its own row. …I wrapped it in a tag of header and to that tag of header I added several classes. …I made it 6 wide, 6 out of the 12, and centered that, so that was row 1. …Row 2 I have two asides, actually, because neither of these pieces of …information are terribly important. And if they didn't display on the page, …it would not be the end of the world, thus the aside tag. …And inside of these aside tags, one of them, I have the image.…
- What is Foundation?
- Exploring the grid system
- Working with lists
- Styling buttons, thumbnail images, and more
- Including flexible video
- Adding breadcrumbs to the navigation
- Working with Clearing, the responsive lightbox
- Creating accordion panels and tabs for in-page navigation
Skill Level Beginner
1. Foundation Introduction and Download
2. The Grid System in Foundation
3. CSS Overview
4. Navigation Systems
Next steps2m 12s
- 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.