Bezdepbonusu7Программирование: статьи и ответы
Меню

Вопрос

Twitter Bootstrap Удалить границу диапазона

Автор вопроса: Harsha M VОтветов: 4

Я использую Twitter Bootstrap. И я использовал span8 и span 4 подряд. Есть ли способ удалить начальное поле слева: 20 пикселей из первого диапазона строки без необходимости переопределять его вручную?

csstwitter-bootstrap

Ответы

Ответ 1 · рейтинг 30 · Andres Ilich

Это поле в 20 пикселей, которое вы видите в области #mainContent, связано с настройкой сетки начальной загрузки, в которой используется контейнер 940px, предполагается, что он будет удален контейнером .row со свойством margin-left:-20px. В вашей настройке ваша область контента работает именно так, как она была разработана, но ваши верхние разделы pageHeader и mainNav не вставлены в сетку должным образом, у вас просто есть div внутри верхних разделов .row, которые не содержатся в соответствующих контейнерах. сетки.

Чтобы исправить это, вы можете просто вставить все свои элементы pageHeader и mainNav в контейнер .span12, и все должно сложиться соответствующим образом.

Исправлена ​​разметка

<header class="row" id="pageHeader">
    <div class="span12">
        <div id="logo">Logo</div>
        <div id="userDetails">userDetails</div>
    </div>
</header>

<nav id="mainNav" class="row">
    <div class="span12">
        <ul>
            <li><a href="home.html">Home</a></li>
            <li><a href="dashboard.html">Dashboard</a></li>
            <li><a href="blog.html">Blog</a></li>
            <li><a href="idea_exchange.html">Idea Exchange</a></li>
        </ul>
    </div>
</nav>

Кроме того, быстрый совет: вы можете переключить цвет фона mainNav на правильный контейнер сетки .span12, просто настроив его следующим образом:

nav#mainNav .span12 {
    background: url("../images/nav_bar_bg.png") repeat-x scroll 0 0 transparent;
    height: 45px;
    overflow: hidden;
}

Ответ 2 · рейтинг 8 · Luis

вы можете добавить класс в свой css с помощью !important:

пример:

.no_margin{
margin:0px !important;
}

и добавьте этот класс в свой html, когда это необходимо.

(извините за мой плохой английский xD)

Ответ 3 · рейтинг 2 · Nati Krisi

есть также небольшая меньшая полезность в

http://getkickstrap.com/extras/#single-view

называется промывкой

Ответ 4 · Fury

Используя класс "row" или "row-fluid" в качестве родителя вашего класса span

<div class="row">
    <div class="span3">
        <ul>
           <li><a href="home.html">Home</a></li>
           <li><a href="dashboard.html">Dashboard</a></li>
           <li><a href="blog.html">Blog</a></li>
           <li><a href="idea_exchange.html">Idea Exchange</a></li>
        </ul>
    </div>
</div>

Перевод вопроса и ответов сообщества Stack Overflow, лицензия CC BY-SA. Оригинал на Stack Overflow.

Похожие материалы