兩個div並排排列，一個是谷歌地圖，另一個是固定寬度

Question

我想並排使用兩個DIV。第一個具有響應寬度的DIV和谷歌地圖裏面...和第二個固定寬度的DIV。

jsFiddle example

HTML

<div class="wrapper"> 
    <div id="map"></div> 
    <div class="right"></div> 
</div> 

CSS

.wrapper{ 
    width: 90%; 
    margin: 0px auto; 
} 
#map { 
    height: 300px; 
} 
.right { 
    background: orange; 
    width: 250px; 
    float: right; 
    height: 300px; 
} 

Answer 1

編輯刪除JS調整/ CSS正確撥弄+

http://jsfiddle.net/FXk4x/10/

JS

var map; 
var elevator; 
var myOptions = { 
    zoom: 4, 
    center: new google.maps.LatLng(50, 10), 
    mapTypeId: 'terrain' 
}; 
map = new google.maps.Map($('#map')[0], myOptions); 
var markers = []; 

使用CSS位置：

CSS

*{ 
    margin:0; 
    padding:0; 
} 

.wrapper{ 
    margin-top:10px; 
    border:solid 1px red; 
    position :relative; 
    width: 90%; 
    margin: 0px auto; 
    height:300px; 
} 
#map { 

    position :absolute; 
    top:0; 
    left:0; 
    bottom:0; 
    right:250px; 

    border: 1px solid; 
} 
.right { 
    position : absolute; 
    top:0; 
    right:0; 
    background: orange; 
    width: 250px;  
    height: 300px; 
} 

FAQ CSS位置here