如何保持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; 
}