Twitter bootstrap - вложенные строки и несколько строк

Question

Я начал использовать загрузку Twitter для этого приложения, над которым я работаю.

Я прочитал документацию о вложенных рядах как в фиксированной сетке, так и в жидкой.

Теперь я хочу сделать что-то вроде этого

Так, конечно, я мог бы сделать что-то вроде этого

<div class="container"> 
    <div class="row"> 
     <div class="span 12">red</div> 
     <div class="row"> 
      <div class="span 3">yellow</div> 
      <div class="span 9">green</div> 
     </div> 
    </div> 
</div> 

, и я думаю, что я хотел бы получить то, что я хочу. Но мне интересно, каковы последствия этого

<div class="container"> 
    <div class="row"> 
     <div class="span 12">red</div> 
    </div> 
    <div class="row"> 
     <div class="span 3">yellow</div> 
     <div class="span 9">green</div> 
    </div> 
</div> 

Я не вижу никакой разницы в настоящее время в моем браузере, но мне интересно, что будет, если я включать в себя несколько элементов строк в одной container тега. Является ли row-nesting единственным правильным способом создания чего-то вроде того, что я показал? В чем разница между этими двумя реализациями моего дизайна, так сказать?

Answer 1

Вторая версия верна. Но оба работают. Разница в том, как он реагирует, когда страница изменена. Вторая версия будет сокращаться и лучше реагировать

Однако, если вы хотите, чтобы контейнеры, чтобы соответствовать изображению вам нужно использовать class="container-fluid" и class="row-fluid"

также удалить пробелы между пролетами и номерами

class="span 3" 

Должен сказать

class="span3"