nikotromus nikotromus - 3 months ago 7
HTML Question

Cant vertically stack elements inside a div

I am trying to get my formatting to look like the following:

Question Choice
textarea textarea


The HTML I have formats it like this:

Question textarea Choice textarea


How can I get two separate columns of element, but then line those elements up inside of their respective columns vertically?

<div id="container1" style="width: 100%; overflow: hidden;">
<div style="width: 600px; float: left;">
<div style="display: inline-block">
<label for="">Question</label>
<textarea></textarea>
</div>
</div>
<div>
<label for="">Choice</label>
<textarea></textarea>
</div>
</div>

Answer

I believe it's because you are using the <label> tag. Try just with a <p> tag. Something like this

<div id="container1" style="width: 100%; overflow: hidden;">
<div style="width: 600px; float: left;">
    <div style="display: inline-block">
        <p>Question</p>
        <p><textarea></textarea></p>
    </div>
</div>
<div>
    <p>Choice</p>
    <p><textarea></textarea></p>
</div>