0

我正在尝试为我的学校制作一个网站，并且我正在努力获得一个有内容区域和侧边栏的区域。正如您在此处看到的：lrch.harrisonbh.com，我希望“Header 1”的顶部与“Sidebar”的顶部相匹配。我在这里把css放在一个jsFiddle上：http: //jsfiddle.net/GHpux/

我在这里使用css代码：

div.body{
    width: 1047px;
    margin-top: 210px;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
}

div.content{
    background-color: #dbdbdb;
    width: 750px;
    max-width: 750px;
    float: left;
    padding: 15px;
    margin-right: 15px;
    z-index: 1;

    display: inline-block;
}

div.sidebar{
    background-color: #dbdbdb;
    width: 215px;
    float: right;
    position: absolute;
    padding: 15px;
    display: inline-block;

}

但是正如您在 jsFiddle 或我的网站上看到的那样，我得到了 div 不匹配的不良影响。我想知道这有什么问题？谢谢。我已经尝试了很多东西。谢谢

4

2 回答 2

3

不错的网站，顺便说一句。抱歉，我没有看到问题。修复方法是：

您需要删除<br />..sidebar

请参阅屏幕截图。

前

删除它使它看起来像这样：

后

于 2013-02-09T07:42:33.393 回答
2

删除<br>之前的侧边栏，从侧边栏中删除position:absolute和float:right添加vertical-align:top到侧边栏和内容。

http://jsfiddle.net/GHpux/1/

于 2013-02-09T07:46:25.443 回答