Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Bootstrap Basics Getting to Know Bootstrap Creating a Simple Page

Samuel Kleos
seal-mask
.a{fill-rule:evenodd;}techdegree
Samuel Kleos
Front End Web Development Techdegree Student 13,728 Points
Posted by Samuel Kleos
.a{fill-rule:evenodd;}techdegree
Samuel Kleos
Front End Web Development Techdegree Student 13,728 Points

Do I need to add col-lg-6 and delete mb-3 given the updated docs?

The docs have changed for this "Button addons" component If you take a look at https://getbootstrap.com/docs/5.3/forms/input-group/#button-addons

The code for the component username button in the docs looks like this: 

<div class="input-group mb-3">
  <input type="text" class="form-control" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="button-addon2">
  <button class="btn btn-outline-secondary" type="button" id="button-addon2">Button</button>
</div>

In the video there's another div on the outside that has a classname col-lg-6 instead of having the additional class 'mb-3' in the "input-group" div.

What do these terms mean? It makes no sense to me. I found out oneline that mb-6 is the same as margin-bottom: 4rem

But should I add the additional div around the input group with the class col-lg-6?

1 Answer

Jamie Reardon
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Jamie Reardon
Treehouse Project Reviewer
Jamie Reardon
.a{fill-rule:evenodd;}techdegree seal-36
Jamie Reardon
Treehouse Project Reviewer

Hi Samuel Kleos bootstrap has a new version of the library since the video was posted (4.0), if you haven't used bootstrap before, you might find it more beneficial to follow along with the same version, so that it's kept the same in terms of class structure, styling, etc.

If you are already comfortable with it, you could choose a version yourself and go ahead and read the documentation and follow along with the guidelines mentioned there for that particular version. It would be in your best interest to take a look at the documentation in general anyway, so that you can understand what each concept does/is about for the library use cases.