Question

<div>
  <asp:CheckBox ID="chxSEN" runat="server" Text="Question" onchange="hideDiv('DIV')"/>
  <div id="DIV" style="display:none">
    <asp:Label ID="lbl" runat="server" Text="Question 2" CssClass="lbl2"></asp:Label>
    <asp:TextBox ID="lbl3" runat="server" CssClass="TextBox"></asp:TextBox>
  </div>
</div>

如果我将css类添加到div id DIV以使其向右浮动，它应该与右边的复选框显示在同一行？

它出现在复选框问题下..

我检查了（看起来它正在休息），但代码中没有。

Answer 1

使用html更改了你的asp控件，例如。

<强> HTML

<div>
    <input type="checkbox" ID="chxSEN" runat="server" Text="Question" />
    <div id="DIV" style="display:none">
        <label ID="lbl" runat="server" Text="Question 2" CssClass="lbl2">test</label>
        <input type="textbox" ID="lbl3" runat="server" CssClass="TextBox"></input>
    </div>
</div>

<强> CSS

    div > input, #lbl{
      float:left;
    }

我也用整个解决方案创建了fiddle。

Answer 2

您可以尝试 Demo 。为演示目的，我使用了HTML表单控件。

<强> CSS：

#DIV {
    display:inline-block;
}
#chxSEN {
    display:none;
    float:left;
    margin-right:10px;
}

<强> HTML：

<div>
<input type="checkbox" ID="chxSEN" runat="server" Text="Question" />
<div id="DIV">
    <label>Test</label>
    <input type="text" />
</div>

<强> JS：

$(document).ready(function () {
    $("#DIV").hide();
    $("#chxSEN").show();

    $('#chxSEN').click(function () {
        $("#DIV").slideToggle();
    });

});

没有漂浮在同一行，如何修复CSS

2 个答案: