From the course: Bootstrap 3 Essential Training
Unlock the full course today
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Using inline forms - Bootstrap Tutorial
From the course: Bootstrap 3 Essential Training
Using inline forms
- Bootstrap has some styles that can help you work with inline forms, that is, forms where it makes sense to make the layout horizontal, so let's take a look at this. Now these styles will apply only to layouts that are at or bigger than the SM breakpoint, or bigger than 768 pixels. and that's why I'm going to make my preview really wide here, and then I'm going to scoot this over this way so you can see it happen. So making a form inline is actually super easy. All you have to do is add a class of form-inline to the element wrapping the form. So right here I can add a class of form-inline, and you can see that the layout for the form is now horizontal. Now this doesn't necessary have to be a form element. A lot of these shorter forms are just input fields that have hooks to processors that might be in JavaScript, like when you work with AngularJS. Another thing that's super popular in the shorter forms is to hide the labels, and the problem with that is that screen readers for the…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
-
-
Creating a basic form6m 24s
-
(Locked)
Formatting radio and checkbox controls4m 18s
-
(Locked)
Using inline forms2m 53s
-
(Locked)
Styling a horizontal form4m 52s
-
(Locked)
Using validation styles4m 56s
-
(Locked)
Using input groups5m 24s
-
(Locked)
Using miscellaneous styles and sizing6m 43s
-
(Locked)
Using icons4m 44s
-
-
-
-
-
-