> Rows must be placed within a .container (fixed-width) or .container-fluid (full-width) for proper alignment and padding. Em português: > Rows devem ser colocadas dentro de um .container (width fixa) ou .container-fluid (largura total) para um alinhamento e valor de padding adequado. Isso está mais relacionado como um guia de boas práticas. Se você analisar bem o código `css` do `bootstrap`, irá notar que existe todo um trabalho por trás do sistema de `grid`, onde possuímos a hierarquia `container` (ou container-fluid) > `row` > `col-x-nn`. <b>Obs.:</b> Lembrando que não há necessidade de seguir esse conceito à risca, mas para o comportamento ideal, é o recomendado. Para montar um sistema de grid corretamente, devemos usá-los nessa ordem visto que: - `container` irá criar uma margem - O elemento `row` possui uma margem negativa, para dar a sensação de um elemento `full-width` - E por fim, o elemento `col-x-nn` possui um `padding`, para evitar que fique tudo "esmagado" Além disso, o `container` mantém o conteúdo centralizado. ###Então por que usar o `container` em outras áreas?### Para manter a harmonia do site. Imagine que para cada seção do site você crie um `section` com uma margem específica. Ao fazer uma manutenção ou precisar ajustar essa margem, você teria que analisar todas as seções e ajustá-las individualmente. Com o `container` tudo fica padronizado e organizado no mesmo local. Também serve como guia de boas práticas para outras áreas. ###Breakpoints### Além disso tudo, o `container` possui definição de `width` baseado em seus `breakpoints` ou "pontos de quebra" (valor em que o layout altera baseado na largura da tela que está sendo usada. Celular, tablet, etc). Isso serve para que ele tenha o comportamento de nunca ficar muito pequeno (em telas grandes) e manter a proporção em todos os dispositivos, sejam eles _celulares_, _tablets_ ou _computadores_. <hr /> *Exemplo real* Faz um certo tempo que isso aconteceu comigo, então não sei se ainda acontece ou se já atualizou. Mas houve uma vez em que um elemento customizado que eu havia adicionado ao `nav-bar` era jogado para linha de baixo depois de ter o `toggle` do menu ativado. Esse problema foi resolvido quando voltei a usar o `.container` (havia removido por não achar necessário). Isso aconteceu pois ele criou o agrupamento adequado para os elementos.