我有这个 CSS，它将自动搜索结果放在 div 中。
我遇到的问题是，当您在分辨率等于或低于 1280 x 1024 的屏幕上预览时，它会将 div 放置在我想要的位置，但如果在分辨率为 1680 x 1050 的不同屏幕上预览，它将搜索结果放在页面的另一侧。
我在 CSS 的 left 边玩，我将它更改为与 1680 x 1050 的屏幕尺寸相匹配，它把它放在我想要的地方，但随后在 1280 x 1024 的屏幕尺寸上将它放在其他地方。
有没有一种方法可以重写它来修复我想要的位置，而不管屏幕分辨率如何？
body {
font-family:Tahoma, Geneva, sans-serif;
font-size:18px;
}
.content{
width:900px;
margin:0 auto;
}
#searchid
{
width:500px;
border:solid 1px #000;
padding:10px;
font-size:14px;
}
#result
{
position: fixed;
width: 500px;
padding: 10px;
display: none;
margin-top: -1px;
border-top: 0px;
overflow: visible;
border: 1px #CCC solid;
background-color: white;
z-index: 100;
left: 54%;
top: 45px;
}
.show
{
padding:10px;
border-bottom:1px #999 dashed;
font-size:15px;
height:50px;
z-index:50;
}
.show:hover
{
color: #FFF;
cursor: pointer;
background-color: #F6F6F6;
}
.image_new {
float: none;
height: 220px;
width: 220px;
clear: both;
overflow: visible;
position: absolute;
visibility: visible;
}
.live {
position: fixed;
visibility: visible;
clip: rect(auto,auto,auto,auto);
}
<input name="search" type="text" class="search" id="searchid" placeholder="Search..." autocomplete="off" />
<input name="button" type="submit" class="btn-style" id="button" value="Search" />最佳答案
为了根据屏幕分辨率更改网页，您必须使用“液体”布局，这意味着您可以指定百分比值而不是指定像素值。这可以通过计算您希望每个元素占据多少屏幕并输入相应的百分比值而不是原始像素值来完成。
关于html - 将 div 固定在不同屏幕尺寸的位置，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26325493/