两个选择框

我有我的asp.net MVC Web应用程序内的下列视图中显示标签问题： -两个选择框

两个大胆的标签“即时拍摄客户” &“客户要出口”正被显示的选择框的旁边，而不是在他们之上。
“Add >>”&“< <删除”按钮显示在彼此旁边，但我需要它们显示在彼此之上。任何人都可以建议我可以遵循使用布局更友好的方法吗？ BR

2012-12-26 John Peter

旁白：使用'> >'和'< < '不'''''或'<<' – Popnoodles

“但我需要它们在彼此之上显示”This是不可能的，你不能显示两个东西在彼此之上。无论如何不是没有镜子。你能解释你真正想要的吗？ – Popnoodles

我的意思是有两个按钮垂直对齐相同 –

尝试这样的事：

@using (Html.BeginForm("CustomersDetails", "Home")) 
{ 
    <text> 
     <strong>Available Customers</strong> 
     <br style='clear:both;' /> 
     <select id="SelectLeft" multiple="multiple"> 
     @foreach (var item2 in Model.OrderBy(a => a.ORG_NAME)) 
     { 
      <option value = "@item2.ORG_ID" >@item2.ORG_NAME</option> 
     } 
     </select>  

     <input id="MoveRight" type="button" value=" Add >> " /> 
     <br style='clear:both;' /> 
     <input id="MoveLeft" type="button" value=" << Remove " /> 

     <strong>Customer to be Exported</strong> 
     <br style='clear:both;' /> 
     <select id="SelectRight" name="SelectRight" multiple="multiple">   
     </select> 
     <p> 
      <button type="submit" id ="nextpage">Next Page >></button> 
     </p> 
    </text> 
}

如果您正在使用float CSS属性，它们将旁边显示。尝试使用br（折线）标记中的clear属性清除（浮动）两侧。

来源

2012-12-26 18:12:01

当你说“但我需要它们显示在彼此之上”时，难以修复按钮，这是不可能的。对标题使用块元素是常见做法。 <strong>是内联的，因此不会自然中断。如果你可以解释你想如何按钮，这个jsfiddle可以编辑，以适应。

http://jsfiddle.net/fzp4p/1/

（ASP.net位除去，这是可行的，直到正确显示在工作）

<h2>Available Customers</h2> 
<select id="SelectLeft" multiple="multiple"> 

</select>  
<input id="MoveRight" type="button" value=" Add &gt;&gt; " /> 
<input id="MoveLeft" type="button" value=" &lt;&lt; Remove " /> 
<h2>Customer to be Exported</h2> 
<select id="SelectRight" name="SelectRight" multiple="multiple">   
</select> 
<p><button type="submit" id ="nextpage">Next Page &gt;&gt;</button></p>

input[type="button"] 
{ 
    display:block; 
    clear:both; 
}

来源

2012-12-26 18:23:05 Popnoodles

感谢您的回复，但它没有给出所需的布局。 –

回答

相关问题