html - table alignment when creating table using divs?

Question

I have a table which is created using Divs and as my columns grew its hard to recognize if it was a table or something else?

What i want

I want all columns in each row to be aligned to another irrespective of width? Just like a normal table

What I have

<div class="tabularStructure">  
<div id="token1">
    <div class="cell">
         <label><bdi>${PredefinedSearch_Label}</bdi></label>
    </div>
    <div class="cell">
         <select id="predefineSrch">
            <option value="default">(None)</option>
        </select>   
    </div>

    <div class="cell">&nbsp;
    </div>
    <div class="cell">&nbsp;
    </div>
    <div class="cell">&nbsp;
    </div>
    <div class="cell">&nbsp;
    </div>
    <div class="cell">&nbsp;
    </div>
    <div class="cell">&nbsp;
    </div>

</div>

       <div class="spacer">&nbsp; </div>

   <div class="tabularStructure">   
<div  id="token2">
    <div class="cell">
    <label><bdi>${Date_Label}</bdi></label>
    </div>
    <div class="cell">
        <select id="date">
             <option value="default">(None)</option>
        </select>
    </div>

    <div class="cell" id="token3">
        <label><bdi>${DayRange_Label}</bdi></label>
    </div>
    <div class="cell">
        <select id="dayRange">
             <option value="default">(None)</option>
        </select>
    </div>

    <div class="cell" id="token5">
        <label for="idFromDate"><bdi>${From_Label}</bdi></label>
    </div>
    <div class="cell">
        <input type="text" id="idFromDate" name="toDate" class="date" />
    </div>

    <div class="cell" id="token4">
        <label for="idToDate"><bdi>${To_Label}</bdi></label>
    </div>
    <div class="cell">
        <input type="text" id="idToDate" name="to" class="date" />
    </div>
        </div>
             </div> 

Check the fiddle for full code Fiddle