無論屏幕分辨率是否爲

這是我的頁面頁眉，它有一個選擇菜單，並且必須位於背景圖像的頂部，如何在屏幕分辨率更改時將其固定在位置？無論屏幕分辨率是否爲

看看

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

無論屏幕分辨率是否爲

回答

相關問題