I am facing a particular scenario:
In a bootstrap row with 2 columns:
- the first column contains a table with a button to add new rows
- the second column has a label and a span (although it doesn't have to be a span)
Both columns have equal heights, but I want the label and the span to occupy the entire column space. The label has a fixed height, while the span should fill the remaining height. I attempted using height: 100%, inserting an intermediate div, but without success
Is this achievable?
Edit: Here is the desired outcome:
<div>
<label>Description</label>
<span class="editorWidth positionDescription">This text varies
This control should expand like the left div
It should also allow scrolling if the text exceeds the space available
Extra
Extra
Extra</span>
http://jsbin.com/niyenudufo/edit?html,css,output
The span.positionDescription should consume the remaining space in the div. I tried converting the span to a div, but the scroll bar appeared outside the container div