如何保持2個固定div的相同位置？

Question

我試圖創建兩個divs被定位爲fixed，並設置left和bottom值

<div id='div1'>test1</div> 
<div id='div2'>test2</div> 

我想帖的div對中心一字排開

_________________________________________ 



       ____ ____ 
      |____| |____| 

_________________________________________ 

我的CSS是如下

div#div1{ 
    position: fixed; 
    display: block; 
    bottom: 48px; 
    left: 35%; 
    width: 200px; 
    height: 300px; 
    background-color:grey; 
    background-repeat: repeat-x; 
    text-align: center; 
    z-index: 500; 
} 
div#div2{ 
    position: fixed; 
    display: block; 
    bottom: 48px; 
    left: 55%; 
    width: 200px; 
    height: 300px; 
    background-color:grey; 
    background-repeat: repeat-x; 
    text-align: center; 
    z-index: 500; 
} 

我也需要這些是fixed位置bec我希望他們保持在同一位置，即使用戶滾動。

我的問題是，如果我改變寬度或改變到不同的屏幕，我不能保持從left到div的相同距離。

所以它可以像

___________________________________ 


     ____  ____ 
     |____| |____| 

___________________________________ 

如果我有一個小屏幕。

任何人都可以幫助我解決這個問題嗎？非常感謝！

Answer 1

你可以試試這個：

<div class="wrapper"> 
    <div id="div1"></div> 
    <div id="div2"></div> 
</div> 

和CSS：

.wrapper{ 
    margin:0 auto; 
    position:fixed; 
    left:50%; 
    margin-left:-250px; 
    bottom:48px; 
    width:500px; 
} 


div#div1{ 
float:left; 
display: block; 
width: 200px; 
height: 300px; 
background-color:grey; 
background-repeat: repeat-x; 
text-align: center; 
z-index: 500; 
} 

div#div2{ 
float:right; 
width: 200px; 
height: 300px; 
background-color:grey; 
background-repeat: repeat-x; 
text-align: center; 
z-index: 500; 
}