Ich habe eine asp.net Webformular Seite, und meine checkboxlist wird nicht ordnungsgemäß funktionieren -
Elemente in checkboxlist immer vertikal ausrichten, aber ich muss es horizontal in CSS machen.
Ich verstehe dieses Problem in der Feldanzeige: Block;
Aber ich brauche dies alle Div zu formatieren, und wenn ich CSS für Checkbox - Check-Feld hinzufügen, es ändert sich nicht.
Wie kann ich checkboxlist Element horizontal ausrichten? Jetzt habe ich dies:
Probleme mit der Ausrichtung von Asp Checkboxlist
Aber ich will es ausrichten horizontal
Mein Code:
<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> </span><input type="submit" value="Submit" /></label>
<label><span> </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>
Meine 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;
}
UPDATE:
1. Ich Update CSS-Code.
Es funktioniert, aber in diesem Fall verliere ich Formatierung. Wie kann ich es ohne Grenzen und mit einer anderen Schriftart machen? –
@ АндрейГолубцов fügen Sie Ihr Bild nach der Anwendung von oben Attribut, so dass ich Ihnen mit der Lösung – Webruster
ich Code und laden Bild –