如何将项目移动到div内的左侧？

我有一个div中的标签，checkboxlist和datagridview。我已经使用内联CSS来移动项目。但它不像我所期望的那样工作。我如何移动它们？我想要连续三个项目。下面我添加了我的aspx代码。如何将项目移动到div内的左侧？

<div id="div2" style="width:100%; height:auto; margin-top:30px"> 
 
     <div id="div21" style="width: 50%; height:auto"> 
 
      <div id="div211" style=" width:15%; height:auto"> 
 
       <asp:Label ID="lblKPI" Text="KPI :" runat="server" style="margin-top:10px; margin-left:20px"> 
 
       </asp:Label> 
 
      </div> 
 
      <div id="div212" style=" width:60%; height:auto; float:left"> 
 
       <asp:CheckBoxList ID="chklstKPI" style="width:auto; height:auto" runat="server"> 
 
       </asp:CheckBoxList> 
 
      </div>         
 
     </div>   
 
     
 
     
 
     <asp:GridView ID="GridView1" runat="server" style="float:left"> 
 
      
 
     </asp:GridView> 
 
    
 
    </div>

来源

2016-08-24 Mike

试'的text-align：左;'在格对齐的所有元素里面 – Ramki

可以为您提供'查看HTML的源代码？这样我们可以看看这个问题。 – BNN

更好地使用三列表更好的作品 – Pravin

您需要div包gridview，并设置float:left到该分区。内部div也需要有float:left。

以下HTML尝试

<div id="div2" style="width:100%; height:auto; margin-top:30px"> 
     <div id="div21" style="width: 50%; height:auto;float:left"> 
      <div id="div211" style=" width:15%; height:auto;float:left"> 
       <asp:Label ID="lblKPI" Text="KPI :" runat="server" style="margin-top:10px; margin-left:20px"> 
       </asp:Label> 
      </div> 
      <div id="div212" style=" width:60%; height:auto; float:left"> 
       <asp:CheckBoxList ID="chklstKPI" style="width:auto; height:auto" runat="server"> 
       </asp:CheckBoxList> 
      </div>         
     </div>   

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


     <asp:GridView ID="GridView1" runat="server"> 
      <Columns> 
       <asp:TemplateField HeaderText="SomeText"> 

       </asp:TemplateField> 
      </Columns> 
     </asp:GridView> 
    </div> 
    </div>

来源

2016-08-24 04:57:20 Mairaj

你必须设置浮动：左格这里的样式属性我给你举个例子只是一味的复制粘贴

<div id="div2" style="width:100%; height:auto; margin-top:30px; position:absolute"> 
 
     <div id="div21" style="width: 50%; height:auto"> 
 
      <div id="div211" style=" width:15%; height:auto"> 
 
       <asp:Label ID="lblKPI" Text="KPI :" runat="server" style="margin-top:10px; margin-left:200px; position:absolute"> 
 
       </asp:Label> 
 
      </div> 
 
      <div id="div212" style=" width:60%; margin-left:200px; height:auto; float:left"> 
 
       <asp:CheckBoxList ID="chklstKPI" style="width:auto; height:auto" runat="server"> 
 
       </asp:CheckBoxList> 
 
      </div>         
 
     </div>

来源

2016-08-24 04:57:50

广场gridview中的div和集float:left;属性为该div

试试这个请：

<div id="div2" style="width: 100%; height: auto; margin-top: 30px"> 
    <div id="div21" style="width: 50%; height: auto; float: left;"> 
     <div id="div211" style="width: 15%; height: auto"> 
      <asp:Label ID="lblKPI" Text="KPI :" runat="server" Style="margin-top: 10px; margin-left: 20px"> 
      </asp:Label> 
     </div> 
     <div id="div212" style="width: 60%; height: auto; float: left"> 
      <asp:CheckBoxList ID="chklstKPI" Style="width: auto; height: auto" runat="server"> 
      </asp:CheckBoxList> 
     </div> 
    </div> 
    <div id="div22" style="width: 45%; height: auto; float: left;"> 
     <asp:GridView ID="GridView1" runat="server" Style="float: left"> 
     </asp:GridView> 
    </div> 
</div>

来源

2016-08-24 05:06:02 SJPadikkoth

请添加样式的div：

<div id="div2" style="width:100%; height:auto; margin-top:30px; text-align: left;"> 
     <div id="div21" style="width: 50%; height:auto; display: inline;"> 
      <div id="div211" style=" width:15%; height:auto; display: inline;"> 
       <asp:Label ID="lblKPI" Text="KPI :" runat="server" style="margin-top:10px; margin-left:20px"> 
       </asp:Label> 
      </div> 
      <div id="div212" style=" width:60%; height:auto; float:left; display: inline;"> 
       <asp:CheckBoxList ID="chklstKPI" style="width:auto; height:auto" runat="server"> 
       </asp:CheckBoxList> 
      </div>         
     </div>   
     <div style="display: inline; width:50%"> 

     <asp:GridView ID="GridView1" runat="server" style="float:left"> 

     </asp:GridView> 
    </div> 
    </div>

来源

2016-08-24 05:39:14

如何将项目移动到div内的左侧？

回答

相关问题