Join Ray Villalobos for an in-depth discussion in this video Enhancing responsive form layouts, part of Bootstrap 3: Advanced Web Development.
- View Offline
- Exercise Files
Bootstrap has fantastic forms and if you look in the CSS section of the manual and…then you click on forms, you can see that they're very easily implemented.…It pretty much takes existing form code and makes it look awesome.…One of the approaches to the new version of Bootstrap is called mobile.…First, and that means making sure things look great on mobile devices.…And I think it would be impressed at how well Bootstrap deals with forms when you…just put in normal form code. But there's a few enhancements and we'll…be taking a look at them in this video. I want to do something kind of like this,…a horizontal form. That lays out the elements of the form…side-by-side, which looks really good, but is also very responsive.…
So, let's take a look at how you would do something like this.…Here is the final version of the form. You can see that we have them…side-by-side, but the very cool thing about forms Is that if you re-size them to…a mobile size, they go on top of each other like they should.…And this is a fairly difficult thing to lay out by yourself.…
- Prototyping the site
- Working with a local web server
- Creating a baseline template with Git
- Scaffolding the main columns
- Making the site modular with PHP includes
- Adding basic navigation
- Adding a carousel
- Working with buttons
- Creating and activating tabs
- Adding page and structure LESS styles
Skill Level Intermediate
1. Planning and Setting Up
3. Building Main Content
4. Expanding Our Content
5. Additional Pages
6. Finishing Our Application
Finishing your websites8m 21s
Next steps1m 42s
- 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.