Question

怎样才能满足不同浏览器不同的分辨率下div内的层的位置固定不动

<div class=head><h1 class=logo><img src=logo.jpg width=960 height=121></h1><div id=top>设为首页</div><div id=time>今天是2014-1-1</div></div>
以上css怎么写才能满足不同浏览器不同的分辨率下div内的层的位置固定不动？其中head宽960高121，top浮在logo.jpg图的右上角，time浮在logo.jpg图的左下角。

Answer 1

设定head的position为relative
再设定id=top的 和id=time的两个div的position都为absolute；
设定好对应的上下左右的偏移像素值。

.head{position:relative;width:960px;height:121px;}
.logo{padding:0;margin:0;}
#top{position:absolute;left:0px;top:0px;}
#time{position:absolute;right:0px;bottom:0px;}

另外，建议你img标签外最好有个div标签，也就是<div class=logo><h1><img src=logo.jpg /></h1></div
这样比较好，规范

Answer 2

<style>
.head{position:relative;width:960px;height:121px;}
.logo{padding:0;margin:0;}/*为什么是h1?有没有搞错*/
#top{position:absolute;left:0px;top:0px;}
#time{position:absolute;right:0px;bottom:0px;}
</style>
<div class=head><h1 class=logo><img src="http://www.baidu.com/img/bdlogo.gif" width=960 height=121></h1><div id=top>设为首页</div><div id=time>今天是2014-1-1</div></div>

Answer 3

#top{float:right;position:relativ;top:具体你自己调;left:具体自己写;}
#time{float:left;position:relativ;top:具体你自己调;left:具体自己写;}
.logo {float:left;}

追问

你说的我已经实践，基本可以实现。但是，一方面，层time另起了一行，并不是在图上浮着；另一方面，position:relativ貌似少了个字母。分只能给一个人，很抱歉不能给你

追答

呵呵，我又不是看分来的，帮帮人而已