对齐Asp复选框列表的问题

时间：2017-04-10 09:15:31

标签： html css asp.net

我有一个asp.net网页表单页面，我的复选框列表无法正常工作 -
checkboxlist中的元素始终垂直对齐，但我需要在css中水平对齐。
我理解字段显示中的问题：块;
 但我需要这个格式化所有div，当我为复选框添加css - check-field时，它不会进行更改 如何使checkboxlist元素水平对齐？ 现在我有了这个：
enter image description here

但我希望将它水平对齐 我的代码：

<div id="infodif" runat="server" visible="true" class="form-style-2">
  <div class="form-style-2-heading">
    <asp:Label ID="Label6" runat="server" />
  </div>
  <label><span>First <span class="required">*</span></span><asp:TextBox ID="faminfobox" class="input-field"  runat="server"  onkeypress="return isAlphaNumericKey(event);" /></label>
  <label><span>Second <span class="required">*</span></span><asp:TextBox ID="iminfobox" class="input-field" runat="server"  onkeypress="return isAlphaNumericKey(event);" /></label>
  <label><span>Third <span class="required">*</span></span><asp:TextBox ID="otinfobox" class="input-field" runat="server" onkeypress="return isAlphaNumericKey(event);" /></label>
  <label><span>Four <span class="required">*</span></span><asp:TextBox ID="OGRNinfobox" CssClass="input-field" class="input-field" runat="server" disabled="true" Enabled="false" onkeypress="return allowOnlyNumber(event);" /></label>
  <label><span>Five <span class="required">*</span></span><asp:TextBox ID="TabNominfobox" CssClass="input-field" class="input-field" runat="server" Enabled="false" onkeypress="return allowOnlyNumber(event);" /></label>
  <label><span>CHECK</span><asp:CheckBoxList ID="CheckBoxList1" runat="server" DataValueField="idGK" CssClass="check-field" class="check-field" DataTextField="ShortName" SelectMethod="GetFinance" RepeatLayout="Flow" RepeatDirection="Horizontal"/></label>
  <label><span>Seven <span class="required">*</span></span><asp:TextBox ID="commentbox" CssClass="textarea-field" class="textarea-field" Text="Введите причину изменения" Enabled="false" runat="server"  Height="21px" /></label>
  <label><span>Eight</span><asp:DropDownList ID="sexinfodrop" runat="server" class="select-field" SelectMethod="GetSex" DataValueField="w" DataTextField="pol" EnableViewState="true" /></label>


  <label><span>&nbsp;</span><input type="submit" value="Submit" /></label>
  <label><span>&nbsp;</span><asp:Button ID="SaveBtn" Text="Сохранить" runat="server" OnClick="SaveBtn_Click" Visible="true" /><asp:Button ID="ChangeReqAf" Text="Сохранить Изменения" runat="server" OnClick="ChangeReqAf_Click" Visible="false" /></label>

</div>

我的css：

  .form-style-2{
    max-width: 800px;
    /*display: flexbox;*/
    padding: 20px 12px 10px 20px;
    font: 13px Arial, Helvetica, sans-serif;
}
.form-style-2-heading{
    font-weight: bold;
    font-style: italic;
    border-bottom: 2px solid #ddd;
    margin-bottom: 20px;
    font-size: 15px;
    padding-bottom: 3px;
}
.form-style-2 label{
    display:block;
    margin: 0px 0px 15px 0px;
  
}
.form-style-2 label >  span{
    width: 300px;
    font-weight: bold;
    float: left;
    padding-top: 8px;
    padding-right: 5px;
}
.form-style-2 span.required{
    color:red;
}

.form-style-2 input.input-field{
    width: 48%;
    
}


.form-style-2 .check-field {
   display: table-row;
  float: left;
 
}
    

更新：
1.我更新了Css代码。

  1. 现在我有enter image description here

2 个答案:

答案 0 :(得分：1)

尝试使用：

BEGIN TRANSACTION -- Find an unclaimed task. SELECT FROM subtasks INNER JOIN tasks ON tasks.id = subtasks.id WHERE tasks.started_at = NULL -- Not claimed ORDER BY tasks.created_at ASC -- First in, first out LIMIT 1 -- We only want to select a single task. FOR UPDATE SKIP LOCKED -- Don't wait for it, keep looking. -- Claim the task. UPDATE tasks SET started_at = clock_timestamp() WHERE id = $taskId -- Use metadata from the subtask to perform the task. -- If an error occurs we can roll back, unlocking the row. -- Will this also roll back if the worker dies? -- Task is complete. -- Mark the task as complete. UPDATE tasks SET completed_at = clock_timestamp() WHERE id = $taskId END TRANSACTION 以及RepeatLayout="Table"

答案 1 :(得分：0)

你可以使用像这样的felxbox

＆＃13;
＆＃13; 
.form-style-2 {
  /*max-width: 500px;*/
  display: flex;

  font: 13px Arial, Helvetica, sans-serif;
}

.form-style-2-heading {
  font-weight: bold;
  font-style: italic;
  border-bottom: 2px solid #ddd;
  margin-bottom: 20px;
  font-size: 15px;
  padding-bottom: 3px;
}

.form-style-2 label {
  display: block;
  margin: 0px 0px 15px 0px;
}

.form-style-2 label>span {
  width: 100px;
  font-weight: bold;
  float: left;
  padding-top: 8px;
  padding-right: 5px;
}

.form-style-2 span.required {
  color: red;
}

.form-style-2 input.input-field {
  width: 48%;
}

.form-style-2 .check-field {
  display: table-row;
  float: left;
}
＆＃13; 
<div id="infodif" runat="server" visible="true" class="form-style-2">
  <div class="form-style-2-heading">
    <asp:Label ID="Label6" runat="server" />
  </div>
  <label><span>First <span class="required">*</span></span><asp:TextBox ID="faminfobox" class="input-field"  runat="server"  onkeypress="return isAlphaNumericKey(event);" /></label>
  <label><span>Second <span class="required">*</span></span><asp:TextBox ID="iminfobox" class="input-field" runat="server"  onkeypress="return isAlphaNumericKey(event);" /></label>
  <label><span>Third <span class="required">*</span></span><asp:TextBox ID="otinfobox" class="input-field" runat="server" onkeypress="return isAlphaNumericKey(event);" /></label>
  <label><span>Four <span class="required">*</span></span><asp:TextBox ID="OGRNinfobox" CssClass="input-field" class="input-field" runat="server" disabled="true" Enabled="false" onkeypress="return allowOnlyNumber(event);" /></label>
  <label><span>Five <span class="required">*</span></span><asp:TextBox ID="TabNominfobox" CssClass="input-field" class="input-field" runat="server" Enabled="false" onkeypress="return allowOnlyNumber(event);" /></label>
  <label><span>CHECK</span><asp:CheckBoxList ID="CheckBoxList1" runat="server" DataValueField="idGK" CssClass="check-field" class="check-field" DataTextField="ShortName" SelectMethod="GetFinance" RepeatLayout="Flow" RepeatDirection="Horizontal"/></label>
  <label><span>Seven <span class="required">*</span></span><asp:TextBox ID="commentbox" CssClass="textarea-field" class="textarea-field" Text="Введите причину изменения" Enabled="false" runat="server"  Height="21px" /></label>
  <label><span>Eight</span><asp:DropDownList ID="sexinfodrop" runat="server" class="select-field" SelectMethod="GetSex" DataValueField="w" DataTextField="pol" EnableViewState="true" /></label>


  <label><span>&nbsp;</span><input type="submit" value="Submit" /></label>
  <label><span>&nbsp;</span><asp:Button ID="SaveBtn" Text="Сохранить" runat="server" OnClick="SaveBtn_Click" Visible="true" /><asp:Button ID="ChangeReqAf" Text="Сохранить Изменения" runat="server" OnClick="ChangeReqAf_Click" Visible="false" /></label>

</div>
＆＃13;
＆＃13;
＆＃13;

相关问题
最新问题