Nie rozumiem spacji twittera i rzędu

Question

Byłem ogromnym użytkownikiem systemu sieciowego 960, i pomyślałem, że wypróbuję Twitter Bootstrap, ale może to jest głupie pytanie i możesz śmiać się i głosować na mnie, ale fakt jest Nie rozumiem rozpiętości i rzędu.

Więc mój problem jest, gdy tworzę kontener i tworzyć przęseł wewnątrz niej, to nie pasuje obok siebie poprawnie:

jak w 960gs jeśli piszę następujące

<div class="container_12"> 
    <div class="grid_4"></div> 
    <div class="grid_4"></div> 
    <div class="grid_4"></div> 
</div> 

Dostaję doskonałą 3 kolumnę obok siebie.

Ale nie mogę tego osiągnąć za pomocą Twitter Bootstrap, niezależnie od tego, co robię, zawsze kończę z nieproporcjonalnymi kolumnami, więc kolumny nie wypełniają pojemnika tak, jak powinno, jak przy 960gs. Jeśli umieści 3 kolumny, margines z prawej strony nie jest poprawny lub nie będzie prawidłowo pasował do kontenera.

Boostrap przykład:

<div class="container"> 
    <div class="row"> 
     <div class="span4"> 
      <h2>Column one</h2> 
      <p> 
       Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. 
      </p> 
     </div> 
     <div class="span4"> 
      <h2>Column one</h2> 
      <p> 
       Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. 
      </p> 
     </div> 
     <div class="span4"> 
      <h2>Column one</h2> 
      <p> 
       Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. 
      </p> 
     </div> 
    </div> 
</div> 

Tak więc w powyższym przykładzie I skończyć z nieproporcjonalnych kolumnach, nie istnieje margines w pierwszej kolumnie po lewej stronie. Jeśli zrobię to w 960gs z klasami siatki, to jest to idealne.

Czym różni się Boot na Twitterze w porównaniu do 960 reklam, które powoduje mój problem?

Answer 1

Powodem:

• pojemnik 940px
• rzędu wynosi 960 z -20px marginesu
• span4 300 x 20 pikseli, z marginesem

gdy szerokość ekran jest < = 940px, -20px z rzędu i margines 20px z span4 znoszą się nawzajem, dlatego pierwszy span4 nie ma lewego marginesu.

Rozwiązanie 'twitter bootstrap':

Dodaj bootstrap-responsive.css i gdy ekran idzie pod 980px i poza 768px:

pojemnik stać 724px, rząd 744px i span4 228px, utrzymując lewy margines na pierwszym span4.