Join Jen Kramer for an in-depth discussion in this video Including panels, part of Up and Running with Foundation 4.
Panels are a nice way of highlighting certain text or areas on your webpage as …important items. By default, a panel is a screen back gray …color with pointy corners. It's a box that goes around whatever it …is that you wrap it around. You can add some additional styles to a …panel to change its color and round the corners if you wish. …Panels will be as wide as their containing grid columns. …If you want panels to be side-by-side, then your grid should reflect the columns …of the appropriate width and number. On this page, I have some scheduling …information for Monday and Tuesday. What I'd like to do is I'd like to set …off that scheduling information as two panels, and I'd like those panels to be …sitting right next to each other. What I"m going to do here to make this …happen, is I'm going to nest the row. So, I'm going to do a div with a class of …row, to start with and after that, I'm going to put in a div with a class of …large-6 columns. And that's going to wrap, all the way …around the text that I have here. So, down here at the bottom, I'll put a …
- 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.