CODEWITHSUNDEEP
twitter-bootstrapless
user1377822
user1377822

Reputation: 679

Bootstrap navbar margins

I'd like to make the left and right margins of the navbar conetnt smaller so the "brand" (left most component) appears more on the left then the default and same for the right component.

Can somebody point me to relevant less variables to modify?

Thanks

Upvotes: 6

Views: 30850

Answers (1)

David Taiaroa
David Taiaroa

Reputation: 25495

With a basic layout, the CSS selector you want is

body > .navbar .brand

Play with margin-left and margin-right until you get the result you want. Depending on how you are calling your CSS styles, you may need to add !important as well, eg 

body > .navbar .brand{
margin-left:-20px !important;
margin-right:-20px !important;  
}

If you don't have any success with this, try ommitting body >

EDIT

If you want to change the width of the entire navbar, try something like 

.navbar{
margin-left:-20px;
margin-right:-20px;
}

You might also need to adjust the details for navbar-inner, eg 

.navbar-inner{
padding-left:0;
padding-right:0;
}

Edit
See if this helps: http://jsfiddle.net/panchroma/zBeZF/

Good luck!

Upvotes: 4

Related Questions