更改媒体屏幕上的元素对齐方式
更改媒体屏幕上的元素对齐方式
提问于 2013-01-15 21:20:14
我有两个div，当屏幕的x轴或y轴高于或小于另一个轴时，它们会改变位置。您可以在JsFiddle示例中对此进行测试。
JSFIddle
当两个ButtonToolbar的位置改变时，我的div元素的位置就会变得混乱。如何解决这个定位问题？
我试过使用position position:relative，但没有成功。有什么想法吗？希望你能理解我的问题。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-01-15 21:31:49
当显示在屏幕顶部时，尝试在.dhFieldset上使用float:left，而不是使用position:relative。
@media screen and (max-aspect-ratio: 1/1) {
.dhFieldset{
color: white;
height: 35px;
width:80px;
margin-left:22px;
float:left;
}此外，如果您不希望它们位于另一个下面-您将需要在.dhButtonToolbar上设置min-width。就像这样，你也可以将dhFieldset的宽度改为百分比宽度。
Stack Overflow用户
发布于 2013-01-15 21:29:49
希望我明白你的问题所在。在媒体查询中，您应该更改"dhFieldset“的显示方式。
所以它是这样的：
正常位置：
.dhFieldset{
color: white;
font-size:6px;
width: 27px;
height:80px;
background-color:green;
}屏幕顶部的：
@media screen and (max-aspect-ratio: 1/1) {
.dhFieldset{
color: white;
font-size:6px;
height: 27px;
width:80px;
margin-left:22px;
float:left;
}这是Updated jsFiddle。
希望它能有所帮助！！干杯。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14338673
复制相关文章
相似问题
腾讯云开发者
