2016-09-20 263 views
0

我有我正在使用的表格中的checkboxlist。我需要與第二欄中的複選框對齊。每行文本框(第二行)的間距爲26px。我找不到如何在複選框列表中的項目之間進行間距。僅設置邊距時,列表的外部不是其中的項目。如何在複選框列表項之間添加間距?

enter image description here

enter image description here

我試圖CELLSPACING,但我不能讓它相當一字排開。

更新2

<td style="vertical-align: top" rowspan="7" Width="175" style="padding: 0;"> 
       <asp:CheckBoxList ID="cbtasklist" runat="server" CssClass="radiobutton"> 
        <asp:ListItem Value="Task 1">Task 1</asp:ListItem> 
        <asp:ListItem Value="Task 2">Task 2</asp:ListItem> 
        <asp:ListItem Value="Task 3">Task 3</asp:ListItem> 
        <asp:ListItem>Task 4</asp:ListItem> 
        <asp:ListItem Value="Task 5">Task 5</asp:ListItem> 
        <asp:ListItem Value="Other1">Other</asp:ListItem> 
        <asp:ListItem Value="Other2">Other</asp:ListItem> 
       </asp:CheckBoxList> 


        </td> 
       <td class="auto-style187" style="vertical-align: top" colspan="2"> 

        &nbsp;</td> 


.auto-style187 { 
     height: 26px; 
     width: 357px; 
    } 

更新3: 難道是容易的每一行做一個複選框,這樣我就可以使用相同的CSS的另一列?

的原因複選框列表是用於驗證一個1必須被選擇。

+0

您是否嘗試過的CheckBoxList.CellSpacing財產? https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.checkboxlist.cellspacing(v=vs.110).aspx – sr28

回答

0

我希望你正在尋找這個

<form id="form1" runat="server"> 
<div style="width: 100%"> 



    <table class="auto-style1"> 
     <tr> 
      <td class="auto-style3"> 
       <asp:CheckBoxList ID="CheckBoxList1" runat="server" Height="163px"> 
        <asp:ListItem>a</asp:ListItem> 
        <asp:ListItem>b</asp:ListItem> 
        <asp:ListItem>c</asp:ListItem> 
        <asp:ListItem>d</asp:ListItem> 
        <asp:ListItem>e</asp:ListItem> 
        <asp:ListItem>f</asp:ListItem> 
       </asp:CheckBoxList> 
      </td> 
      <td class="auto-style8"> 
       <table class="auto-style1"> 
        <tr> 
         <td class="auto-style5"> 
          <asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChanged"></asp:TextBox> 
         </td> 
         <td>aaaa</td> 
        </tr> 
        <tr> 
         <td class="auto-style6"> 
          <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 
         </td> 
         <td class="auto-style7">aaaa</td> 
        </tr> 
        <tr> 
         <td class="auto-style5"> 
          <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> 
         </td> 
         <td>aaaa</td> 
        </tr> 
        <tr> 
         <td class="auto-style10"> 
          <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox> 
         </td> 
         <td class="auto-style11">aaaa</td> 
        </tr> 
        <tr> 
         <td class="auto-style12"> 
          <asp:TextBox ID="TextBox5" runat="server"></asp:TextBox> 
         </td> 
         <td class="auto-style13">aaaa</td> 
        </tr> 
        <tr> 
         <td class="auto-style5"> 
          <asp:TextBox ID="TextBox6" runat="server" OnTextChanged="TextBox6_TextChanged"></asp:TextBox> 
         </td> 
         <td>aaaa</td> 
        </tr> 
       </table> 
      </td> 
      <td class="auto-style4"></td> 
     </tr> 
     <tr> 
      <td class="auto-style2">&nbsp;</td> 
      <td class="auto-style9">&nbsp;</td> 
      <td>&nbsp;</td> 
     </tr> 
     <tr> 
      <td class="auto-style2">&nbsp;</td> 
      <td class="auto-style9">&nbsp;</td> 
      <td>&nbsp;</td> 
     </tr> 
     <tr> 
      <td class="auto-style14"></td> 
      <td class="auto-style15"></td> 
      <td class="auto-style11"></td> 
     </tr> 
     <tr> 
      <td class="auto-style2">&nbsp;</td> 
      <td class="auto-style9">&nbsp;</td> 
      <td>&nbsp;</td> 
     </tr> 
    </table> 



    </div> 

    </form> 

看到圖像

updated one

我只是把一個表內表。你可以只刪除不需要列你的願望

不要忘了編輯的文本框中陣容它您

+0

可悲的是,沒有奏效。看到更新 – scubieman

+0

檢查這個新的希望這個詭計將幫助你 –

+0

文本稍微偏離他們想要完美列隊的文本框。 – scubieman

0

你爲什麼不跟這個嘗試在你的CSS:

checkbox { padding-bottom: 10px; }