html - 向左浮动以水平对齐元素

Question

我在主要内容的两侧都有左右箭头按钮。我将按钮设置为input type="button"并将它们转换为block元素display:block ，它们都有float:left。

问题是它们被放置在所需的位置，但其他元素位于不同的行，如导航菜单，按钮被向上/向下推到另一行。

有人可以在这里看看我的工作样本吗？JS斌

Answer 1

你的问题描述性不够。我认为您的意思是 div 向上移动以与菜单一致。这就是我观察到的。我修改了您的代码，以便 div 将在菜单和 << 按钮之后启动。

<ul class="nav-step">
    <li class="active">1</li>
    <li>2</li>
    <li>3</li>
  </ul>
  <input class="left" type="button" value="<<" />
  <div style="clear:both;"></div>
  <div class="pg-wrapper">
    <div class="current" id="pg1">
      <label>First</label>
      <input type="text" />
    </div>
    <div id="pg2">
      <label>Second</label>
      <input type="text" />
    </div>
    <div id="pg3">
      <label>Third</label>
      <input type="text" />
    </div>
  </div>

观察 ：

<div style="clear:both;"></div>

希望这会有所帮助。