24 votos

Twitter Bootstrap Quitar Margen del grupo

Estoy usando Twitter Bootstrap. Y he utilizado span8 y período de 4 en una fila. Es de todos modos hay que quitar el líder margin-left:20px desde el primer lapso de la fila, sin necesidad de más montar manualmente ?

29voto

Andres Ilich Puntos 41712

Que 20px margen de lo que ves en tu #mainContent área es debido a la configuración de la rejilla bootstrap, que utiliza un contenedor de 940px, se supone que debe ser eliminado por el .row envase con un margin-left:-20px de la propiedad. En su configuración, su área de contenido está funcionando de la forma en que fue diseñado, pero su parte superior pageHeader y mainNav secciones no están adecuadamente insertados en la red, usted sólo tiene divs dentro de la .row superior de las secciones de las que no están contenidos dentro de los contenedores apropiados de la red.

Para solucionar esto sólo puede insertar todos los de su pageHeader y mainNav elementos dentro de una .span12 contenedor y todo debe de pila en consecuencia.

Fijo marcado

<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>

También, sugerencia, puedes cambiar tu mainNav color de fondo para el correcto cuadrícula contenedor de .span12 simplemente por la orientación es tal que así:

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

5voto

Luis Puntos 21

usted puede agregar una clase en el css con una !importante:

ejemplo:

.no_margin{
margin:0px !important;
}

y añadir que la clase en el código html cuando sea necesario.

(lo siento por mi mala inglés xD)

2voto

Nati Krisi Puntos 371

también hay pequeñas de menos utilidad en

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

llama flushspan

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by:

X