html - divを使用してテーブルを作成するときのテーブルの配置?

Question

Div を使用して作成されたテーブルがあり、列が大きくなると、それがテーブルであるか他のものであるかを認識するのが難しくなりますか?

私が欲しいもの

幅に関係なく、各行のすべての列を別の列に揃えたいですか? 普通のテーブルと同じように

私が持っているもの

<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> 

完全なコードのフィドルを確認してください Fiddle