按鈕和文本框不在線

Question

我有以下代碼

 <div class="well sidebar-nav"> 
     <ul class="nav nav-list"> 
      <li class="nav-header-myLeagues">Create A New League</li> 
      <li class="divider"></li> 
      <li class="li-myLeagues"> 
       <asp:Label ID="LeagueNameLabel" runat="server">League Name:</asp:Label></li> 
      <li class="li-myLeagues"> 
       <asp:TextBox ID="LeagueNameTextBox" runat="server"></asp:TextBox> 
       <asp:Button ID="SubmitNewLeagueButton" CssClass="btn btn-primary" runat="server" CommandName="SubmitNewLeague" Text="Submit" /> 
      </li> 
     </ul> 
    </div> 

出於某種原因，該按鈕是不完全符合文本框中行，任何想法如何做到這一點？

Answer 1

包裹文本框和按鈕<div></div>並設置CSS float：left to div's

<li class="li-myLeagues"> 
    <div style="float:left"> 
     <asp:TextBox ID="LeagueNameTextBox" runat="server"></asp:TextBox></div> 
    <div style="float:left;margin-left:10px;"> 
      <asp:Button ID="SubmitNewLeagueButton" CssClass="btn btn-primary" runat="server" CommandName="SubmitNewLeague" Text="Submit" /> 
</div>   
</li> 

添加CSS來.li-myLeagues類

.li-myLeagues 
{ 
display:inline-block; 
float:left; 
} 

Answer 2

嘗試把你的CSS如下

.li-myLeagues li 
{ 
    display: inline; 
     list-style-type: none; 
    padding-right: 20px; 
    float: left; 
} 

這將是有用的....

見here is the same thing which I had made for you..