-1

由于标题设计 img ，我无法让 my.content-panel和#panel-design浮动在右侧。我已经尝试过使用不同的值。我想在div 上方放置and的右侧.content#searchbar-containerz-index.content-panel#panel-design.content#searchbar-container

<body>
        <div class="header">
            <img id="searchbar-container" src="images/searchbar1.png">
        </div>
        <div class="content">
            <div class="sidebar"></div>
            <div class="content-panel">
                <div id="panel-design"></div>
                   <!--main content here-->
            </div>
        </div>
</body>

的CSS：

    .content {
    position: relative;
    max-width: @width;
    height: 768px;;
    margin: 0 auto;
    padding: 0;
   }
       .content-panel {
        position: absolute;
        float: right;
        margin: 0;
        padding: 0;
        width: 753px;
        height: 100%;
        background-color: blue;
        z-index: -2;
    }
    #panel-design{
        float: right;
        width: 685px;
        height: 375px;
        background-color: red;
        z-index: -1;
    }
    .sidebar{
        width: 285px;
        height: 100%;
        margin: 0;
        padding: 0;
    }

不能全贴。但这是我需要实现的，基本上上面的灰色图像是 ，#searchbar-container而德普的图片是#panel-design前面的.content-panel。

在此处输入图像描述

到目前为止，这是我的页面的样子：

在此处输入图像描述

蓝色的 div 是.content-panel

红色的 div 是#panel-design

上面的灰色img是#searchbar-container

.content没有背景颜色，但它的大小是通过曲线#searchbar-container

4

1 回答 1

1

所以我从你的问题中了解到，你想#searchbar-container重叠你的#panel-design.

一种方法是使.headerdiv 固定，但您可能不希望这样做，因为这样它就变得独立于滚动。

我想出的另一种使用位置的方法你可以在这里absolute看到小提琴

于 2013-10-18T03:53:45.677 回答