may may - 2 months ago 5
CSS Question

different content in div col md 6 equal to each other

I have 2 columns using

col-md-6
but it looks like the left content float 'up'.

enter image description here

My attempt :



<div class="row">
<div class="col-md-6">
<form method="post">
<select name="satuanhari" onchange="this.form.submit()">
<option value="7" <?php if($hari =="7") echo "selected"; ?>>7 Days</option>
<option value="30" <?php if($hari =="30") echo "selected"; ?>>30 Days</option>
<option value="90" <?php if($hari =="90") echo "selected"; ?>>90 Days</option>
</select>
</form>
</div>
<div class="col-md-6">
<h3 align='center' style="float:left">In the last <?php echo $hari ?> days</h3>
</div>
</div>





I want to make them look equally on a straight line. do you guys have any idea to solve this?

Answer

to make it come in 1 line. add a custom class to the 1st col-md-6 that has your form and give it float left. and for the tag make the margin-top:0

**html**
<div class="col-md-6 form_div" style="
    float: left;
"></div>

**css**
.form_div {
float:left
}

h3 {
margin-top:0
}

let me know if this works.