Bootstrap Row запускается за краем

Question

В настоящее время я изучаю Bootstrap. Я натолкнулся на часть кода, где я пытался создать кучу строк, чтобы создать своего рода таблицу. Но когда я запускал код в браузере, края строк начинаются за экраном. Посмотрите на очень простой фрагмент кода «Hello World» ниже в JS Fiddle.

<div class="row">Hello World!</div> 

http://jsfiddle.net/x8y50sas/

Почему текст, начинающийся из-за краев? Подробное объяснение могло бы помочь?

Answer 1

Вы должны включать в себя ячейку внутри строки:

<div class="container"> 
    <div class="row"> 
    <div class="col-xs-12">Hello World!</div> 
    </div> 
</div> 

Причиной смещения является то, что строки в загрузчике имеют отрицательный запас. Они всегда должны содержать ячейку, которая добавляет дополнительное дополнение.

Более подробная информация в документации: http://getbootstrap.com/css/#grid

Answer 2

Потому что, чтобы иметь возможность использовать подвесную систему вам нужно обернуть элемент внутри класса container. Прочитайте эту статью: http://getbootstrap.com/css/#overview-container

Пример:

<div class="container"> 
    <div class="row">Hello World!</div> 
</div> 

Answer 3

необходимо заключить блок "строку" в блоке "контейнер", как:

<div class="container"> 
    <div class="row"> 
    <!-- Example: 3 Cell --> 
    <div class="col-lg-4">...</div> 
    <div class="col-lg-4">...</div> 
    <div class="col-lg-4">...</div> 
    </div> 
</div>