【发布时间】：2014-10-12 22:30:48
【问题描述】：
我有这个 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 标记，为了便于理解，还请提供指向 jsfiddler 的链接。
-
“我想要的地方”在哪里？我们不知道您是否希望将其固定在侧面、始终在中间、始终从侧面 x 数量，或者其他更复杂的规则。