2017-02-28 7 views
0

リピータを使用してグリッドを作成していますが、グリッドが画面の幅を埋めることはありません。これは、中継器の端と右側の境界との間に空白を残して、切断します。画面の幅を埋めるためにリピーターを取得する方法は?

enter image description here私はラインは全体のすべての道を行くようでしたwidth:100%に最後<td>タグを設定しようとしたが、それは他のすべての列は、一番左に上に移動させ、レイアウトを台無しにしました。

コード:

<tr> 
       <td style="border-left:1px solid; border-right:1px solid; height:400px" > 
        <asp:Repeater ID="rptHazDetails" runat="server"> 
        <HeaderTemplate> 
         <table border="1"> 
          <tr style="border-bottom:1px solid;"> 
           <td> 
            UN Number, </br> 
            Proper Shipping Name 
           </td> 
           <td style="padding:5px"> 
            Class , </br> 
            Packing Group 
           </td> 
           <td style="padding:5px"> 
            Pieces 
           </td> 
           <td style="padding:5px"> 
            Tunnel Code 
           </td> 
           <td style="padding:5px"> 
            Gross KG 
           </td> 
           <td style="padding:5px"> 
            Net KG 
           </td> 
          </tr> 
        </HeaderTemplate> 
        <ItemTemplate> 
         <tr style="border-bottom:1px solid;"> 
          <td style="padding:5px;"> 
           <asp:Label ID="lblUNNumber" runat="server" Text='<%# Eval("UnNumber") %>' /> </br> 
           <asp:Label ID="lblProper" runat="server" Text='<%# Eval("Packages") %>' /> 
          </td> 
          <td style="padding:5px;"> 
           <asp:Label ID="lblClass" runat="server" Text='<%# Eval("IMOClass") %>' /> </br> 
           <asp:Label ID="lblPacking" runat="server" Text='<%# Eval("IMOPage") %>' /> 
          </td> 
          <td style="padding:5px;"> 
           <asp:Label ID="lblPieces" runat="server" Text='<%# Eval("PieceBreakDown") %>' /> 
          </td> 
          <td style="padding:5px;"> 
           <asp:Label ID="lblTunnelCode" runat="server" Text='<%# Eval("TunnelCode") %>' /> 
          </td> 
          <td style="padding:5px;"> 
           <asp:Label ID="lblGrossWeight" runat="server" Text='<%# Eval("GrossWeight","{0:0.##}") %>' /> 
          </td> 
          <td style="padding:5px;"> 
           <asp:Label ID="lblNetWeight" runat="server" Text='<%# Eval("NetWeight","{0:0.##}") %>' /> 
          </td> 
         </tr> 
        </ItemTemplate> 
        <FooterTemplate> 
         </table> 
        </FooterTemplate> 
       </asp:Repeater> 
       </td> 
      </tr> 

私はちょうど画面全体にすべて到達する境界線にしたいとのギャップを残していません。

+0

私に尋ねます。ありがとうFabrizio –

答えて

0

は私が設定:

table { 
    width: 100%; 
} 

この方法では、テーブルには、ウィンドウ全体をカバーします。次に、各列の幅をpxまたは%で指定することができます。最も良い方法はブートストラップクラスを使用することです。だから、その後、あなたはその列に4列のスパンを与えるための例COL-MD-4のためのクラスを設定することができ、あなたのヘッダ

に含める、あなたはまた、SMスクリーンのための列を非表示にし、他の効果を行うことができます。行くと

http://getbootstrap.com/css/#grid

を確認するか、私はあなたがアップデートを持っている場合はお聞きしたかった以上の情報

ファブリツィオBertoglio

+0

テーブル幅を100%に設定しようとしましたが、動作しませんでした – user123456789

+0

@ user123456789申し訳ありませんが、私は間違いました。あなたは 'table {width:100%; } ' –

関連する問題