Responsive 2 span6 can't side by side

Question

Bootstrap Responsive 2 span6 inside span12 not side by side. Any idea?

<div class="MainDiv container-fluid" style="border:1px solid pink">
<div class="row-fluid">
  <div class="span12" style="border:1px solid green">    
    <div class="span6" style="border:1px solid red">Span A</div>
    <div class="span6" style="border:1px solid red">Span B</div>
  </div>
</div></div>

Question makes no sense, you have span 6 nested inside span 12 so what did you expect? — Rick Calder, Oct 19 '12 at 12:25
The layout you are using is not correct (each span nesting requires a row), but the border is the source of the problem : check http://stackoverflow.com/q/11299089/1478467 — Sherbrow, Oct 19 '12 at 12:27

score 1 · Accepted Answer · answered Oct 19 '12 at 12:50

1

........Live demo................

Hi now used to display:inline-block;

as like this

[class*="span"], .row-fluid [class*="span"]{
display:inline-block;
    vertical-align:top;  
}

Live demo

answered Oct 19 '12 at 12:50

Rohit Azad Malik

31,410
17
69
97

That mean I have to include Grid system from bootstrap together with bootstrap-responsive.css? – user1732217 Oct 19 '12 at 13:18

score 0 · Answer 2 · answered Oct 19 '12 at 12:37

0

use float: left for both of the span6 classes

like : style="border:1px solid red; float:left"

answered Oct 19 '12 at 12:37

Moorthy GK

82
5

Responsive 2 span6 can't side by side

2 Answers2

Linked