2015-03-02 45 views
0

也许有人知道问题在哪里,为什么我的边栏重叠页眉和页脚。传单边栏-v2问题重叠

HTML

<div id="sidebar" class="sidebar collapsed"> 
    //sidebar content 
</div> 

<div id="map" class="sidebar-map"></div> 

CSS

#map { 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    height:100%; 
    width: 100%; 
} 

老版边栏的正常工作。

+0

http://oi58.tinypic.com/14d0f3o.jpg – 2015-03-02 17:13:09

回答

0

虽然很难说JSfiddle或Plunker上没有适当的测试用例,但是:如何在#sidebar上设置margin-topmargin-bottom您的侧边栏元素?

CSS:

#sidebar { 
    margin-top: ?px; 
    margin-bottom: ?px; 
} 
+0

页脚没有一个固定的高度,这取决于屏幕分辨率。在这种情况下,侧边栏不等于地图高度。我需要将边栏设置为地图的尺寸​​。如果我将侧边栏div放入地图div,会发生这种情况,但随后.leaflet-left(缩放控制,...)被推到右侧400-500px。 – 2015-03-02 18:34:02

+0

也许你可以创建一个测试用例,最好在Plunker上?这里有一个包含边栏v2的样板:http://plnkr.co/edit/5GnUQK – iH8 2015-03-03 01:40:03

+0

我在页面底部固定了页面底部(html,body {height:calc(100% - 26px);})和然后使用margin-top和margin-down。它为我解决。 – 2015-03-08 12:52:55