0

第一次问问题：）

我的标题 DIV 有一个像波浪一样弯曲的背景。我有一个浮动到右侧的侧边栏，位于标题 DIV 下方的 DIV 中。标题的背景图像在侧边栏所在的位置向右弯曲，在侧边栏碰到标题 div 底部的地方留下一个间隙（因为显然 div 不是弯曲的）。我需要侧边栏的背景延伸到标题下方，因此没有间隙。我应该怎么办？

HTML：

<div id="header"></div>
<div id="body>
<div id="main-content"></div>
<div id="side-bar></div>
</div>

CSS：

#header{
width:100%;
height:272px;
margin:0 auto;
background-image:url('../img/header.png');
    background-repeat:no-repeat;
text-align:center;

}

#body{
width:960px;
height:auto;
margin:0 auto;
padding-bottom:159px;

}

#main-content{
width:60%;
height:auto;
margin:0 auto;
float:left;
padding:15px;
background-color:#fbf8ee;

}

#side-bar{
width:30%;
height:auto;
margin:0 auto;
float:right;
padding:10px;
background-color:#961912;
    border-right:thick #558c21 solid;
    border-left:thick #558c21 solid;

}

![这里是它目前的样子的截图。侧边栏没有内容，所以它很窄，但我希望它在标题图像后面向上延伸，所以没有间隙。1

4

3 回答 3

0

不太确定我是否理解正确，但尝试添加：

position: relative;
top: -10px;

到#side-bar，你可以在这里看到http://jsfiddle.net/NpZJV/

如果我可以建议，请不要使用 % 作为宽度/高度，而使用 px 代替。

于 2013-05-03T23:02:04.910 回答
0

不是 100% 确定您想要实现的目标，但如果您希望侧边栏显示在标题后面并向上延伸，请尝试添加到侧边栏样式：

margin-top: -100px; /* Higher or lower number depending on how far up you want it to go */
position: relative;
z-index: -1;
于 2013-05-03T23:06:14.200 回答
-1

您可以使用 CSS3 来制作背景大小，看看它是否能解决您的问题。 http://www.w3schools.com/cssref/css3_pr_background-size.asp 尝试使用

background-size: 600px 2921px;

你也许可以让它适合

于 2013-05-03T22:54:49.113 回答