无论屏幕分辨率是否为

这是我的页面页眉，它有一个选择菜单，并且必须位于背景图像的顶部，如何在屏幕分辨率更改时将其固定在位置？无论屏幕分辨率是否为

看看

enter image description here

这里更大的分辨率

enter image description here

的HTML如下所示：

<div class="header"> 
      <table border="0" cellpadding="0" cellspacing="0" width="100%"> 
       <tbody> 
        <tr> 
         <td style="padding: 16px 10px 0 52px ;text-align: right; width: 230px; background: url('images/searchbar_dropdown.png') no-repeat scroll 72px 15px transparent;"> 
         <select id="dept" name="dept" type="text" style="background-color: white; border: 2px solid rgb(182, 109, 49); width: 150px; height: 35px; opacity: 0;"><option></option>          
</select></div></td> 
         <td rowspan="2" style="width: 2px;">&nbsp;</td> 

        </tr> 

      </table> 
     </div>

和头部CSS

.header { 
background: url("../../images/background.png") repeat; 
position: fixed; 
color: white; 
min-height: 65px; 
padding: 5px 5px; 
margin: 0; 
}

来源

2013-01-09 Digital fortress

的一个好方法是使用百分比，而不是常量... –

@TiagoSalzmann不要slilly现在请.... –

的选择是流出了你，因为fixed position

您需要环绕箱的包装用position relative和箱为position absolute

例子：

<div id="boxWrapper"> 
    <select class="selectbox"> 
     <option value="">option 1</option> 
     <option value="">option 2</option> 
     <option value="">option 3</option> 
    </select> 
</div> 

#boxWrapper { 
    position: relative: 
} 

.selectbox { 
    position: absolute; 
    top: 0px; 
    left: 0px; 
}

来源

2013-01-09 17:11:33

我相信这可能是您的width: 100%的组合您的td上的和text-align: right。我怀疑你的td没有按照你的意愿行事，也没有保留width: 230px，但随着屏幕宽度和table一起扩展。随着text-align: rightselect元素然后也在移动。最简单的修复方法是定位select，使其为text-align: left，除非您打算这是正确的，并且要遵循的背景（在这种情况下，您具有附加背景的是您需要纠正的问题）。

来源

2013-01-09 17:18:43 ScottS

试试这个代码

<div class="header"> 
      <table width="100%" cellspacing="0" cellpadding="0" border="0"> 
       <tbody> 
        <tr> 
         <td style="padding: 16px 10px 0px 52px; text-align: right; width: 230px; background: none repeat scroll 0% 0% whitesmoke; position: relative;"> 
         <select style="border: 2px solid rgb(182, 109, 49); height: 35px; background: none repeat scroll 0% 0% yellow; opacity: 1; position: absolute; width: 150px; left: 0px;" type="text" name="dept" id="dept"><option></option>          
</select></td> 
         <td style="width: 2px;" rowspan="2">&nbsp;</td> 

        </tr> 

      </tbody></table> 
     </div>

来源

2013-01-09 18:10:18

无论屏幕分辨率是否为

回答

相关问题