2015-02-23 59 views
0

我有一個包含3列的表,其中在一列中我使用了基於其他列數據的行跨度。現在我想增加行跨度或分隔兩個日期的行之後的行寬度。我的代碼如下所示有沒有辦法在一些行後增加特定行的寬度

<table class="table table-striped table-bordered table-hover" id="meals-table"> 

    <thead> 

    <tr bgcolor="#328AA4" style="">      
     <th class="col-xs-2" style="text-align: center"> 
     <font color="3366CC"> Date 
      </th> 
     <th class="col-xs-2" style="text-align: center"> 
     <font color="3366CC"> Food 
      </th> 

     <th class="col-xs-2" style="text-align: center"> 
     <font color="3366CC"> Quantity 
      </th> 
    </tr> 
    </thead> 
    {% for rdate in entities %} 
    {% for entity in rdate %} 
    {% set counter = 0 %} 
    {% set rowcount = 0 %} 
    {% set count = 0 %} 
    {% for food in entity %} 
    {% set counter = counter + 1 %} 
    {% endfor %} 
    {% for food in entity %} 
    {% set count = count + 1 %} 
    {% set rowcount = rowcount + 1 %} 
    <tr>  

    {% if rowcount <= 1 %}     
         <td style="text-align: center; vertical-align: middle; background-color: white;" rowspan="{{counter}}">{{ food.cdate }}</td> 
    {% endif %} 
    <td style="text-align: left; padding-left: 17%;">{{ food.foodname }}</td>    
    <td style="text-align: left; padding-left: 15%;">{{ food.qtyeaten }}&nbsp;&nbsp;{{ food.qtyname }}</td>        
    </tr> 
    {% endfor %} 
    {% endfor %} 
    {% endfor %} 
</table> 

任何人都可以請幫我解決這個問題。

+0

請勿使用表格,將div用於自定義表格佈局。 – Sandeeproop 2015-02-23 08:07:54

+0

「自定義表格佈局」爲什麼?一張桌子是什麼故事。表格數據應該使用表格標記來表示,而不是使用div來表現爲表格 – atmd 2015-02-23 08:20:34

+0

您可以發佈html輸出,以便將它添加到小提琴而不是模板中。 – atmd 2015-02-23 08:21:20

回答

0

只是增加寬度,以你的風格元素:

<th style="width: 40%; text-align: center ...

(它似乎是作爲表的數據發現,在表頭列數並不總是相同)

相關問題