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 4 Basics (Retired) Using Bootstrap Components Adding Buttons and Button Groups

Nathan Bivens
Nathan Bivens
14,460 Points
Posted by Nathan Bivens
Nathan Bivens
14,460 Points

Margins and Padding with Bootstrap

I noticed this a few videos back when dealing with the bottom portion of the web page. (About Treehouse & Staying Up to Date with Full Stack Conf) This question also applies to adding margins to the button in this particular video.

How come every time I input a margin or padding property to any element, and I go above 3rem, the value never applies to the element.

e.g. "class = mx-3" (This will be applied to the element)

e.g. "class = mx-4" (This no longer applies to the element)

Has anybody experienced this behavior? If so, why does this behavior happen?

I appreciate the input.

1 Answer

Jeremiah Bushau
Jeremiah Bushau
24,061 Points

There are only the 3 options. http://v4-alpha.getbootstrap.com/utilities/spacing/. You could always create your own class to get the desired margin/padding though. Or if you are comfortable with sass you can add more sizes by adding entries to the $spacers sass map variable. As stated in the docs. : )

Nathan Bivens
Nathan Bivens
14,460 Points
Nathan Bivens
Nathan Bivens
14,460 Points

I appreciate it, Jeremiah! That makes sense. I must have skimmed over that section.