css - 如何将控件 float 在图像顶部(使用图像背景)

Question

我的网站页面的整个顶部都有一个 Logo 图像。 Logo 本身仅占左侧的三分之一左右。该条右侧的三分之二是纯蓝色和深蓝色。我有几个链接和右侧显示的用户名，我想将它们 float 在图像上。

最初，我让图片占据了栏 (div) 左侧的三分之二，而我的链接位于右侧的单独 div。问题是该方法在两个 div 之间留下了明显的边界线，即使它们是相同的颜色。

透明度会有帮助吗？我该如何设置？

    _________________________________________________________________
    |  LOGO HERE                              User: David Troy      |
    |  LOGO HERE                          Home | FAQ | Contact Us   |
    |_______________________________________________________________| 

Answer 1

关于“细线空间”:如果您使用的是 Internet Explorer，则必须省略 div 之间的空格，如下所示:

<div class="left">Logo</div><div class="right">Links</div>

我相信这是由于 Quirks 模式造成的；它在 XHTML 严格模式下按预期显示。

然后，CSS 看起来像这样:

div.left {
  float : left;
}
div.left, div.right {
  margin : 0px;
  padding : 0px;
}