我以为我得到了这个问题,然后我遇到了一个我无法弄清的问题。Div高度为100%,要么不够高,要么太高
如果我将包装高度设置为auto,它会下降到内容的底部并停止,如果内容不像窗口那样高,则会看到它背后的背景。
如果我将包装设置为100%this发生。
当屏幕最大化时,页面高于窗口高度,并强制页面滚动不必要。 请参阅this
当窗口较小时,背景会在内容后面爬行。
我不知道什么页面滚动时,它不需要,当窗口收缩我想包装的背景仍然覆盖内容。 我该如何解决这个问题/我没有看到什么?
感谢
编辑:
<div id="xwraper">
<div id="wraper">
<br class="cl cr" />
<div id="imgholder">
<div class="slider">
<ul>
<li rel="1">
<img src="id_tags_1.png" width="510" height="340" alt=" " />
<h4> </h4>
</li>
<li rel="2">
<img src="id_tags_2.png" width="510" height="340" alt=" " />
<h4> </h4>
</li>
<li rel="3">
<img src="id_tags_3.png" width="510" height="340" alt=" " />
<h4> </h4>
</li>
<li rel="4">
<img src="id_tags_4.png" width="510" height="340" alt=" " />
<h4> </h4>
</li>
</ul>
<div class="clear controls">
<img src="../../img/white-arrow-left.png" width="10" height="13" alt="<" class="prev" />
<span class="pages">
<img src="../../img/blank.gif" width="13" height="14" alt=" " class="number hide selected 1" />
<img src="../../img/blank.gif" width="13" height="14" alt=" " class="number hide 2" />
<img src="../../img/blank.gif" width="13" height="14" alt=" " class="number hide 3" />
<img src="../../img/blank.gif" width="13" height="14" alt=" " class="number hide 4" />
</span>
<img src="../../img/white-arrow-right.png" width="10" height="13" alt=">" class="next" />
</div>
</div> </div>
<div id="desc">
<p>Identification Tags are a versatile, cost effective way to get your marketing message out. Used by travelers, sports teams, schools, health clubs, athletes and organizations, these tags are durable and each comes with it's own clear lanyard.</p>
<p>The back of each tag can be written on or we'll print another message on them for you. Choose one of our standard sizes, or we'll work with your custom size and shape. Please call Customer Service for pricing on custom shapes and sizes.</p>
<ul>
<li class="ulhead center">Product Specific Info.</li>
<li class="ulhead">Stock</li>
<li>Printed on durable .020” thick plastic</li>
<li class="ulhead">Color</li>
<li>Neon and metallic colors are not available on Identifcation Tags</li>
<li class="ulhead">Production Time</li>
<li>Standard production time is approximately 10 days</li>
<li class="ulhead">General</li>
<li>Tags with no imprint are available, write or call for pricing</li>
<li><a href="../../contact_us.php">Contact us</a> for a quote on custom sizes or shapes</li>
</ul>
</div>
<br class="cl cr" />
<table id="pb">
<tr>
<td> </td>
<td>
<table>
<tr class="bold">
<td> </td> <td>125</td> <td>250</td> <td>500</td> <td>1,000</td> <td>1,500</td>
</tr>
</table>
</td>
</tr>
<tr class="mt1">
<td>4-Color Process</td>
<td>
<table>
<tr>
<td>Each</td> <td>2.24</td> <td>1.37</td> <td>.86</td> <td>.569</td> <td>.452</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>Black Imprint</td>
<td>
<table>
<tr >
<td>Each</td> <td>.48</td> <td>.30</td> <td>.23</td> <td>.156</td> <td>.124</td>
</tr>
</table>
</td>
</tr>
<tr>
<td> </td>
<td>5A </td>
</tr>
</table>
<br class="cl cr" />
<h3>ASI 85950 • PPAI 265052 • SAGE 56520<br />All content © 2012 - Blue Frog Printing</h3>
</div>
</div>
而对于包装的CSS:
#xwraper {
position:absolute;
left:50%;
top:0px;
width:1px;
height:100%;
overflow:visible;
z-index:-3;
}
#wraper {
position:absolute;
left:-450px;
top:0px;
width:900px;
height:100%;
padding-top:110px;
background-color:#FFFFFF;
border-left: solid 5px #003860;
border-right: solid 5px #003860;
z-index:inherit;
}
您还可以,如果想看看www.bluefrogprinting.net/2012/id_tags/看看我在说什么
完成编辑我的答案:P让我知道它是否适合你:) – lpd 2012-01-27 16:12:09