From the course: Bootstrap 4 Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Create input groups

Create input groups - Bootstrap Tutorial

From the course: Bootstrap 4 Essential Training

Start my 1-month free trial

Create input groups

“

- [Instructor] We've already looked at how to turn form elements into inline elements. There's a variation of this called input groups, and it allows you to create form elements within a horizontal layout that have a little bit of a better-integrated look, so let's check this out. So the main class here for these elements is called input group, and you can use them on regular input elements or even in navigation, anywhere where you want a more integrated look to an input field. Now, you can also add items at the beginning or at the end of the input groups, and if you want to put it at the beginning, you would add a class to that element of input-group-prepend. If you want to add the element at the end, you would use input-group-append. In addition to that, any element that you want to place in there, like a button or a checkbox or just some text, you would add the class of input-group-text, and you are going to need to worry about either the aria-label attribute if you want this to be…

Contents