我有这个标记:
<body>
<div class="prevBtn"> <a> < </a> </div>
<div id="player"> some code </div>
<div class="nextBtn"> <a> > </a> </div>
</body>
我正在尝试获取此布局:
注意:上一个和下一个按钮靠近#player
我正在尝试这样:
.nextBtn{
float:left;
width:15%;
margin-top:180px;
}
.nextBtn a{
float:right;
}
.player{
float:left;
width:70%;
margin-top:100px;
}
.prevBtn{
float:right;
width:15%;
margin-top:180px;
}
.rightBtn a{
float:left;
}
问题是如果分辨率太大或太小,它不会像布局一样,
对于任何分辨率,我怎样才能实现这一目标?
最佳答案
用一个 770px + 左右按钮宽度的 div 包围它(将它们的宽度从百分比更改为固定宽度)。
这将保证所有人都在一起。
还可以使用 overflow: hidden
或末尾带有 clear:both
的 div,这将确保一切就绪。
关于css - 3 格 : one centered and the two others one in each side,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7724576/