如何将此搜索框对齐到右侧？

我刚刚开始掌握HTML。我无法设法将此对齐，这是菜单的一部分。我基本上希望它将搜索框对齐到右侧，所以它看起来像Facebook或类似的东西。直到现在我一直在使用填充，但我无法再继续下去。如何将此搜索框对齐到右侧？

<li id="search-10" class="widget_search"> 
<form role="search" method="get" action="http://chusmix.com/"> 
    <div> 
    <input class="ubicacion" type="text" value="" name="s" id="s"> 
    <input type="submit" id="searchsubmit" value="Ir a Ciudad"/> 
    </div> 
    </form></li>

感谢

来源

2010-12-15 lisovaccaro

添加'浮动：right'或'右：0;'你'.widget_search' CSS类 – cristian 2010-12-15 15:37:26

我的问题可以帮助你 http://stackoverflow.com/questions/21117707/how-to- align-one-form-element-within-a-li-with-the-other-li – Jammi 2014-01-14 16:11:13

你有一些选择：

keep the div(bad way) 
add align"right" to the div 
on the form and remove the div (better way) 
use float:right 
text-align: right

，并把表单上并删除div。

另外我建议把样式放入CSS而不是HTML元素中。

来源

2010-12-15 15:42:45 jack

添加text-align:right;您form和删除不必要的div。

请注意，这仅适用于内联元素：文本，输入，锚点等。如果您想将框（div，表格，表格等）对齐到右侧，则需要使用float:right;并设置高度在浮动物品的父级上，或者在漂浮物品的下方添加明确的div。另外，除了不必要外，作为初学者，这种第二种方法对于你来说会更加复杂。

来源

2010-12-15 15:40:11

个人而言，我不会用一个列表

<div id="search-10" class="widget_search"> 
    <form role="search" method="get" action="http://chusmix.com/"> 
    <div style="text-align: right;"> 
    <input class="ubicacion" type="text" value="" name="s" id="s"> 
    <input type="submit" id="searchsubmit" value="Ir a Ciudad"/> 
    </div> 
    </form> 
</div>

而且我也建议您实验text-align

来源

2010-12-15 15:41:18

他可能在该列表中有多个项目。你怎么确定他的选择是不合理的？ – 2010-12-15 15:43:36

@Alin +1因为客观！你是对的，“李”可能是合理的，尽管这是更大讨论的一部分。我个人觉得'li'在项目之间没有任何关系时会被过度使用。 – 2010-12-15 15:51:24

列表是新表:)。 – 2010-12-15 15:59:12

如何将此搜索框对齐到右侧？

回答

相关问题