Join Jen Kramer for an in-depth discussion in this video Challenge: Create a grid, part of Up and Running with Foundation 4.
So I've presented now eight videos on how Foundation's grid systems works. …So, are you ready for a challenge? I hope so. …I've given you a number of documents in your exercise files folder for this …particular video. You're going to find another big image …there, that is by itself that you're going to move to the Images folder inside …of your Foundation folder. You're going to find an entire folder of …images the folder is called Thumbs. Move that folder just as it is and drop …it in to the images folder, inside of the foundation folder.…
And you will also find a HTML file called gridchallenge.html. …And that's going to be your starting point for this. …I'm showing you the finished result. This is the page at large resolutions. …We've got something that kind of looks like a header, you can see that it's …centered here on the page. We have some little text, next to this …image here. Then we have a column here that has some …information about the events schedule. The schedule Monday, the schedule Tuesday. …
- 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?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
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.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.