【问题标题】:Float right is not working in IE 7 but works in FF IE8浮动权利在 IE 7 中不起作用,但在 FF IE8 中起作用
【发布时间】:2014-01-14 23:59:30
【问题描述】:

我有这个代码

<div id="facebook_bar"> 
  <div style="float:left;">
  <img src="images/topbar_followus.png" width="70" height="25" /> 
  <img src="images/topbar_twitIcon.png" width="30" height="25" /> 
  <img src="images/topbar_fbicon.png" width="30" height="25" />
  </div>
    <div id="newsletter_box"> 


   <img src="images/topbar_subscribe.png" width="220" height="25" />
      <input type="text" name="cm-ktkykk-ktkykk" id="ktkykk-ktkykk" />
      <input type="image" src="images/btn_submit.png" width="55" height="25" />

      </div>
  </div>

css 是

#facebook_bar {
 background-color:#323334;
 height:30px;
 padding-top:15px;
 padding-left:20px;
 padding-right:20px;
}
#newsletter_box {
 float:right;
 /*margin-top:-30px;*/

}

右侧的 div 显示在第一个 div 之后的下一行,而不是在同一行

【问题讨论】:

  • 为什么你不只是使用float:left 来调整水平位置?让两个 div 并排坐 IMO 的最简单方法
  • 其实我无法重现这个问题。我将 CSS 和 HTML 复制到一个空白模板中,它只适用于上述浏览器。你的问题出在别的地方。尝试提供一个独立的示例,即从&lt;html&gt;&lt;/html&gt;,这样我们就可以复制'n'paste'n'运行它。
  • 它现在可以工作了,我想当我向左添加内联浮动时,IE 有点没有加载那个。但现在它很好。实际上最初我没有第一个 div 框,然后我添加了它以便它可以向左浮动

标签: css html internet-explorer-7 internet-explorer-6


【解决方案1】:

我最初将此作为评论发布,但不妨将其作为答案。

为什么不将float:left 用于#newsletter_box 和内联浮动div。这将确保它们垂直位于同一位置,然后您可以使用 % 宽度调整水平位置。

我还会查看 this 文章以清除浮动,因为您涉及图像。

【讨论】:

    【解决方案2】:

    您还需要浮动左侧栏,将float:left 添加到#facebook_bar。

    【讨论】:

    • 他已经内联了:&lt;div style="float:left;"&gt;#facebook_bar 是包装器。
    • 你是对的。 (我的回答是从只有 CSS 发布到问题,没有赶上更新版本)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-03-12
    • 2011-09-12
    • 2015-01-14
    • 1970-01-01
    • 2012-03-13
    相关资源
    最近更新 更多