Skip to content

Document broken "outdent" with multiple navbar-right classes #12951

@ghost

Description

First reported in #12947 . Resubmitting with an example and more details as requested by @mdo .

http://jsfiddle.net/D2RLR/5339/ (this is a pure CSS issue, but you'll need to expand your viewport so that the navbar is not collapsed)

The example shows the navbar from the docs but with one change -- the form is pulled right with .navbar-right.

I believe the intent of all the negative margins on .navbar-right is so that the right-most one will go up to the right edge of the navbar.

It works with just one .navbar-right element, but not with two or more because right floated elements appear in reverse order from their markup order.

In the example, the `.nav' items are shifted right 15px. They should not be but the form should be shifted right 15px.

Relevant excerpt from navbar.less

// Outdent the form if last child to line up with content down the page
&.navbar-right:last-child {
      margin-right: -@navbar-padding-horizontal;
    }

The negative margin should apply to the first element with the .navbar-right class. But I'm not sure how to select that.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions