Class="row" in bootstrap

Class="row" in bootstrap
0

#1

why should write

<div class="row">   <div class="col-xs-12"></div></div>

i can write that only <div class="col-xs-12"> </div> without class="row">

??


#2

I’ve edited your post for readability. When you enter a code block into the forum, remember to precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard.


#3

I’m not sure I understand your question.

But you would never want something to have a class of row AND a class of col-* - that would not make sense. Something is either a row or a collum. Generally, we have columns grouped into rows - the rows contain the columns, and the columns contain the data. An example from the bootstrap webstie.

<div class="container">
  <div class="row">
    <div class="col">
      1 of 2
    </div>
    <div class="col">
      1 of 2
    </div>
  </div>
  <div class="row">
    <div class="col">
      1 of 3
    </div>
    <div class="col">
      1 of 3
    </div>
    <div class="col">
      1 of 3
    </div>
  </div>
</div>

A simpler example might be this:

<div class="container">
    <div class="row">
        <div class="col-md-6">
            Column A
        </div>
        <div class="col-md-6">
            Column B
        </div>
    </div> 
</div> 

Or I could add some background colors to make it clearer (normally I’d do it in CSS but I’ll do it in situ in the HTML for simplicity’s sake):

<div class="container">
    <div class="row">
        <div class="col-md-6" style='background-color: red'>
            Column A
        </div>
        <div class="col-md-6" style='background-color: green'>
            Column B
        </div>
    </div> 
</div> 

Please let us know if that doesn’t answer your question.


#4

thank you :smiley::smiley::smiley::smiley::smiley: