Как удалить зазор между навигационной и контейнерной жидкостью?

Это мой случай: http://codepen.io/gkos/pen/LxmrMP?editors=1100 Как удалить зазор между навигационной и контейнерной жидкостью?

<header> 
    <nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
     <ul class="nav navbar-nav"> 
     <li class="navbar-text">Item</li> 
     <li class="navbar-text">Item</li> 
     <li class="navbar-text">Item</li> 
     <li class="navbar-text">Item</li> 
     </ul> 
    </div> 
    </nav> 
</header> 
<div class="site-content container-fluid"> 
    <div class="row"> 
     <div class="col-md-9"> 
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p> 
    </div> 
    <div class="col-md-3 site-sidebar"> 
     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p> 
    </div> 
    </div> 
</div> 

<footer> 
    <div class="container-fluid"> 
    <div class="row navbar navbar-default"> 
     <div class="col-md-4"><p class="navbar-text">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p></div> 
     <div class="col-md-4"><p class="navbar-text">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p></div> 
     <div class="col-md-4"><p class="navbar-text">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p></div> 
    </div> 
    </div> 
</footer>

У меня есть Navbar, контейнер-жидкость с двумя Collons. Между навигатором и контейнером, отображенным в синем (цвет фона тела), есть пробел, как его можно удалить, чтобы цвет фона колонок заполнил от навигатора до нижнего колонтитула без пробелов? Я знаю о коллапсировании маржи, но я не могу найти какой-либо маржинальный маркер ....

Использование отрицательного поля в классе контента сайта Я мог бы удалить этот пробел, но мне нужно жестко определить высоту пробелов в пикселях, и это кажется не правильный ответ!

.site-content 
    margin-top: -21px

С уважением

источник

2017-02-03 geckos

'.navbar {край дно: 0; } ' –

Возможный дубликат [Загадочный пробел между Bootstrap Navbar и строкой внизу] (http://stackoverflow.com/questions/15071306/mysterious-whitespace-in-between-bootstrap-navbar-and-row-underneath) – vanburen

navbar класс имеет по умолчанию margin-bottom:20px в начальной загрузки CSS. Вы можете изменить его, добавив следующее:

.navbar { 
    margin-bottom: 0px; 
}

нотабене: Убедитесь, что указанное выше свойство css находится ниже начального значения css bootstrap.

источник

2017-02-03 19:18:54

THAAAAAAAAAAAAAAAAANKS ! – geckos

Рад, что я мог помочь человеку. Отметьте это как правильный ответ и повысьте его, если это поможет исправить вашу проблему. –

Кстати, как я могу проверить свойства классов начальной загрузки. Есть ли ссылка со всеми свойствами классов, где я могу искать свойства или классы!?! – geckos

Ваша проблема класса Navbar, он добавляет нижний край 20px, использованию нужно сделать, что край дно в .nav баре как 0

источник

2017-02-03 19:33:42

Как удалить зазор между навигационной и контейнерной жидкостью?

ответ

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