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
David Jarrin
Courses Plus Student 11,182 PointsBootstrap margin-bottom problem!!
Ok I am having a problem getting rid of this "margin-bottom:30px" that is in my bootstrap.min.css file. I assume this because when I inspect the element in chrome I see
media="all"
.jumbotron {
padding: 30px;
margin-bottom: 30px;
font-size: 21px;
font-weight: 200;
line-height: 2.1428571435;
color: inherit;
background-color: #eee;
}
then I went into the bootstrap.min.css file and deleted the margin-bottom attribute but it still shows up when I reload the page (and save of course). I viewed the source and see that my bootstrap.min.css doesn't match the one that's in the source, why is this?
Robert Richey
Courses Plus Student 16,352 PointsAdding to what mikes02 said, several styles in Bootstrap can have !important, so in order to override them, your style will also need this.
Example:
body {
padding: 0px !important;
}
David Jarrin
Courses Plus Student 11,182 PointsI will try this but I still don't know where the styles are coming from since I have deleted this attribute from the bootstrap file, but it still shows up in the source.
David Jarrin
Courses Plus Student 11,182 PointsI sorta just went with your solutions, just in one of my partial scss files I just put
.jumbotron {
margin-bottom: 0px;
}
and it worked itself out.....still found it mysterious that the changes I was making to the bootstrap.min.css file wasn't being reflected in the source.
2 Answers
Andres Aguero
30,545 PointsHi David,
Are you doing this on a static website? Or a wordpress website
David Jarrin
Courses Plus Student 11,182 PointsWordpress
Andres Aguero
30,545 PointsDavid!
I know your problem. If you are like me then you must have installed the Bootstrap Shortcodes Options.
Go to Settings on wordpress for this plugin and uncheck the "Load Twitter Bootstrap css file"
That should work!
David Jarrin
Courses Plus Student 11,182 PointsI actually had BS short codes installed but not activated, this was a good suggestion though.
mikes02
Courses Plus Student 16,968 Pointsmikes02
Courses Plus Student 16,968 PointsIn addition to Bootstrap do you have your own CSS file? If you load your own CSS file below Bootstrap you should be able to setup a style the overwrites that value.