css将菜单对齐到右边

Question

这可能是一个简单的问题，但我似乎无法想象我的生活。我正在制作一个移动菜单，我试图让它坐在屏幕右侧。 （搜索栏和菜单图标）

我的问题是如果我把它漂浮到右边，背景就会消失，如果我文本对齐它，我在链接上的文字缩进决定显示。

我的HTML

<div id="subHeader">
 <ul class="mobileMenu">
   <li>
      <form>
          <input type="text" name="search" id="search" />
            <input type="submit" value="Search"  class="sub" />
      </form>
  </li>
  <li class="menLink"><a href="#">MobileMenu</a></li>
 </ul>      
</div>

在jsfiddle上可以看到一个例子

http://jsfiddle.net/zazvorniki/9SWbs/1/

非常感谢一些帮助！

Answer 1

我通过将width :100%和float: right添加到#subHeader来实现您所需的布局。我还将float: right添加到.mobileMenu li并删除了margin的{​​{1}}属性。请看下面的变化和jsfiddle ...

.menlink

jsfiddle demo