Row inside bootstrap collapse

Row inside bootstrap collapse

I'm using Bootstrap 2.3.2 for a website which contains an accordion
element with one row within it. Accordion is span6 and I expected that the
row will be able to contain two span3 elements but it can't. Here is my
code simplified:
<div class="span6">
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse"
data-parent="#accordion2" href="#collapseOne">
<p><h3>Some text here</h3></p>
</a>
</div>
<div id="collapseOne" class="accordion-body collapse">
<div class="accordion-inner">
<div class="row">
<br />
<div class="span3 offer">
<div class="offer-wrap">
This one should be on the left
</div>
</div>
<div class="span3 offer">
<div class="offer-wrap">
This one should be on the right, but is BELOW
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
I was able to make them appear next to each other, but only with some
nasty CSS fiddling, which only works on my screen size.
If I put that row outside of accordion element everything looks perfect.