如何使div内的内容显示在一行中

Question

我在div中有4个标签，它看起来像这样：

我希望它们以一行显示，我该怎么做？

标签代码：

      <div style="float:left; width:50%">

         <asp:UpdatePanel ID="loginPanel" runat="server" UpdateMode="Always">
            <ContentTemplate>
              <asp:Label ID="LoginLabel" runat="server"  CssClass="label-info" Font-Bold="true"  ForeColor="White"  Width="300px"/> 
            </ContentTemplate>
         </asp:UpdatePanel>
            <%--Login ID--%>
          <asp:UpdatePanel ID="RolePanel" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <asp:Label ID="ShowRole" runat="server" CssClass="label-info" Font-Bold="true" ForeColor="White" Width="300px"/>
                </ContentTemplate>
            </asp:UpdatePanel>
        <%-- role --%>
            <asp:UpdatePanel ID="timePanel" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <asp:Label ID="ShowTime" runat="server" CssClass="label-info" Font-Bold="true" ForeColor="White" Width="300px"/>
                </ContentTemplate>
            </asp:UpdatePanel>
            <%--<br />--%>
         <asp:UpdatePanel ID="projPanel" runat="server" UpdateMode="Always">
          <ContentTemplate>
                    <asp:Label ID="ProjCount" runat="server"  CssClass="label-info" Font-Bold="true" ForeColor="White" Width="300px"/> <%--project counter--%>
           </ContentTemplate>
            </asp:UpdatePanel>
            </div>

Answer 1

我不知道asp.net，但只有一个css：

.label-info{
    display : inline-block;
    float : left;
}

Answer 2

看来是

的部分

  

<%--<br />--%>

打破了界限。一旦改变了，CSS位display: inline-block;就可以了。

Answer 3

请使用以下css属性，因为<asp:label/>会呈现为<div>。

div.lable-info{
display:inline;
}