0

我很难在我的标题中放置一个包含联系信息的 div。我已经阅读了这个问题几个小时，但还没有找到解决方案。我正在尝试将我的联系信息堆叠在布局的右上角。

--

我想要实现的图像：

http://i45.tinypic.com/2zrgu8o.jpg

我的代码当前生成的图像：

http://i48.tinypic.com/mbhlcz.jpg

--

我的 HTML：

<html>
    <head>

  <link rel="stylesheet" href="/css/header.css" />

    </head>

<meta http-equiv="Content-Type" content="text/html; charset=big5" /></head>

<body style="margin:0; padding:0;">

<div id="logo">
<img src="/images/logo-top.png">
</div>

<div class="contact">
Email: sadlkj@yahoo.com | Phone: 1 (732) 235-7239
</div>



<div id="header-bg"> 
</div>


</body>
</html>

我的 CSS：

#logo {
    postion: fixed;
    width: 300px;
    top: 0;
    left: 0;
    right: 0;
    margin-left: auto; 
    margin-right: auto;
    z-index: 1;

} 

#header-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 50px;       
    background-image: url("/images/header-bg.png");
    background-repeat: repeat-x;
    z-index: -1;


}

.contact {
    float:right;
    margin-left:10px;
    margin-bottom:10px;}
}

非常感谢您的帮助。

4

4 回答 4

0

The problem can be solved by putting the contact div BEFORE the logo div in your HTML.

floats only float to the right or the left, not up. The contact div is below the bottom of the logo div and so floats right at that level. By putting it before the logo it floats right before the logo pushes it down.

于 2012-05-26T08:48:59.267 回答
0

我建议使用 a<span>而不是 div，或者使用<div style="display: inline;">

于 2012-05-26T07:15:29.613 回答
0

你已经做好了，你的类定义中只有一个 typeo 。您必须说 0px 而不仅仅是 0 来表示您的定位

top:0px;
left:0px;

这里...看看：http: //jsfiddle.net/t5LZL/2/

于 2012-05-26T07:16:31.903 回答
0

使用这个 html 结构并改变你的 css

<div id="header-bg"> 
<div class='center_wrap'> 
 <div id="logo">
 <img src="/images/logo-top.png">
 </div>

 <div class="contact">
 Email: sadlkj@yahoo.com | Phone: 1 (732) 235-7239
 </div>
</div>
</div>

不能再碰运气了

于 2012-05-26T08:58:54.210 回答