I am working on a layout with five select inputs that I want to arrange horizontally within the parent div.
However, the current code setup is not achieving the desired layout:
<div id="divtable">
<select class="abc"></select>
<select class="abc"></select>
<select class="abc"></select>
<select class="abc"></select>
<select class="abc"></select>
</div>
This is my CSS:
#divtable{
display:table;
width:100%;
table-layout:fixed;
border:thin solid red;
}
.abc{
display:table-cell;
width:17%;
margin:5px 0;
padding:3px;
border:thin solid #999;
border-radius:3px;
}
Here's the fiddle link for reference: here