CODEWITHSUNDEEP
htmltwitter-bootstrapfont-awesome
cYn
cYn

Reputation: 3381

Bootstrap Navbar Spacing

First here is my Plunker code: http://plnkr.co/edit/lh9t3ThQrJF3Tauv5Sno?p=preview

Please note that you should expand the preview pane to the left in order to see all of the elements.

What I'm trying to do is reduce the spacing between the red (X) (remove symbol) and the item. Basically when you press the red (X) the item is removed from the navbar. Right now it doesn't look right at all with the huge spacing between the two. I've tried using other elements such as span, <a>, padding, margin, and they all doesn't seem to be too compatible with the navbar as it seems to only like <li> in terms of alignment and spacing.

What else can I do to get the spacing to come closer between the red (X) and item?

Upvotes: 0

Views: 719

Answers (1)

isherwood
isherwood

Reputation: 61083

http://jsfiddle.net/isherwood/8ZawD/2 (navbar collapse classes disabled for convenience)

.icon-remove-sign {
    margin-left: -20px;
}

Tested in Chrome, FF, and IE10 on Win7/64.

Here's an updated answer based on the comments below. Note that I modified the HTML to make it more logical from an accessibility standpoint.

http://jsfiddle.net/isherwood/8ZawD/4/

Upvotes: 1

Related Questions