I am facing some challenges in figuring out how to nest a span within another span using Bootstrap.
My objective is to have a centrally aligned block, with the following structure inside:
- One row containing:
- A block on the left (span6)
- A block on the right (span6)
- Another row containing:
- A centered button (span 6 offset3)
You can view the issue here: http://jsfiddle.net/UBTv4/18/
<div class='row'>
<div class='span6 offset3'>
<div class='well'>
<h2>Title</h2>
<div class='row'>
<div class='span6'>
<p class="lead">Bloc left : </p>
</div>
<div class='span6'>
<p class="lead">Bloc right : </p>
</div>
</div>
<div class='row'>
<div class='span6 offset3'>
<input id="play" type="submit" value="play" class="btn btn-primary"/>
</div>
</div>
</div>
</div>
What seems to be the issue?
I aim for something like this: