Bootstrap 3.0 align navbar и логотип внизу

В настоящее время у меня есть логотип с правой стороны на навигационной панели (код ниже) Как я могу заставить navbar выровнять нижнюю часть строки, а не придерживаться вершины? Логотип имеет более высокую высоту, чем навигационная панель и, следовательно, задает высоту строкиBootstrap 3.0 align navbar и логотип внизу

<div class="row"> 
    <div class="col-sm-10" id="nav-left"> 
     <div class="navbar-header"> 
      <div class="collapse navbar-collapse" id="tws-navbar-top"> 
       <ul class="nav navbar-nav navbar-top"> 
        <li><a href="#" class="navbar-top-item">HOME</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div class="col-sm-2" id="nav-right"> 
     <img class="img-responsive" src="image" alt="logo" /> 
    </div> 
</div>

источник

2014-01-28 resurrectedstar

Не могли бы вы предоставить [JSFoddle] (http://jsfiddle.net/)? Я думаю. .nav> li имеет отступы. Вы должны изменить это, чтобы получить выравнивание, которое вы хотите. –

bootstrap [navbar] (http://getbootstrap.com/components/#navbar) имеет разную разметку. Я не уверен, почему вы используете логотип и навигатор в строке. [Play] (http://bootply.com/new) здесь с вашей разметкой. и если вам все равно не удастся. отредактируйте свой вопрос и обновите его с помощью того, что вы пробовали, и высоты и ширины логотипа. – Ravimallya

Вы можете добавить margin-top к вашим .navbar-header DIV.

Значение поля равно высоте вашего логотипа минус 50 пикселей, что является значением по умолчанию для навигационной высоты в Bootstrap.

.navbar-header { 
    margin-top: 20px !important; //if the logo has a 70px height. 
    }

Пример here on bootply.

источник

2014-01-28 20:58:40 guli

Bootstrap 3.0 align navbar и логотип внизу

ответ

Смежные вопросы