Css 如何使用Bootstrap3.0显示类似foursquare的地图

我不确定css和html结构

这是我的html

<div class="row">
<div class="col-lg-4">  
    <div class="panel panel-primary">
        <div class="panel-heading">View Plan</div>
        <div class="dam-holder"></div>
    </div>
</div>
<div class="col-lg-8">
    <div class="gmaps"><div id="gmap_geocoding"></div></div>
</div>
</div>

你可以在这里看到正在运行的地图

---

提前感谢您

您可以使用CSS

位置：绝对

相应地放置地图。将所有容器设置为100%高度，并使用

overflow-y:scroll

使左列独立滚动。CSS3<规范>高度：计算（100%-0）可用于确保地图始终为全高

#map-canvas {
    width:33.3333%;
    height:calc(100% - 0);
    z-index:-1;
    position:absolute;
    right:0;
    top:0;
}

这里有一个工作示例，应该可以帮助您

---

我更喜欢使用窗口滚动，我仍然相信只使用引导式css而不使用任何自定义。。除非很好地使用定制/覆盖引导CSSok，否则它看起来不会像Foursquare页面。我不介意定制css，但是仍然有很多方法可以让window scroll代替divhi使用window scroll代替div scroll有什么解决方法吗？可能需要一些调整。你有没有试着自己玩呢？我做了一些修改，得出了这样一个结论：——请接受我的回答，因为它回答了你原来的问题

#map-canvas {
    width:33.3333%;
    height:calc(100% - 0);
    z-index:-1;
    position:absolute;
    right:0;
    top:0;
}