Centrowanie responsywnej strony internetowej za pomocą bootstrap - css, twitter-bootstrap

To, co chcę mieć, to wyśrodkowanie treści na lewej i prawej stronie na mojej stronie. Rodzaj rzeczy uzyskanej dzięki posiadaniu kodu:

.container {
width: 90%;
margin: 0 auto;
}

Jednak korzystam z programu inicjującego na Twitterze i nadal chcę, aby strona była responsywna, a wykonanie powyższego wydaje się łamać układ siatki.

Czy ktoś może mi doradzić, jak to zrobić?

Odpowiedzi:

0 dla odpowiedzi № 1

Nie użyłem twittera, ale standardowa metoda centrowania obiektu w html przy użyciu css z marginesami jest następująca:

.pojemnik { szerokość: 90%; margin: 0 auto 0 auto; }

Które powinny dać takie same wyniki jak:

.pojemnik { szerokość: 90%; margines: 0 5% 0 5%; }

i:

.pojemnik { szerokość: 90%; margines po lewej: 5%; margines prawy: 5%; }

---

0 dla odpowiedzi nr 2

Używając span12, jak podano w dokumentacja sieci płynów, ponieważ kontener główny rozwiąże go bez konieczności przerywania wbudowanej reakcji.

Coś takiego - http://jsbin.com/amovub/5/edit

EDYTOWAĆ: Zaktualizowałem powyższy JSBin, aby spróbować rozwiązać poniższy komentarz. Esencja to:

CSS:

.centeredContent{
width: 90%;
margin: 0 auto;
}

HTML:

<div class="span12">
<div class="centeredContent">

<!-- your content -->

</div> <!-- /centeredContent -->
</div> <!-- /span12 -->

---

0 dla odpowiedzi № 3

Ta strona jest jedną ze stron przykładowych Bootstrap, które również reagują:

http://twitter.github.com/bootstrap/examples/hero.html

Jeśli Firebug tę stronę, zobaczysz, że główna klasa „kontenera” używa po prostu:

.container {
margin-left: auto;
margin-right: auto;
}

---