html - 看不到

Question

知道为什么我看不到 H1 吗？

<div id="getTheProducts" style="clear: both; margin-top: 15px; margin-bottom: 15px; border: 1px solid #DDD;background-color: #f8f8f8; width: 857px; height: 50px; text-align: left;">
<div class="clear"></div>
<div id="getProductsSlide" style="width: 850px; overflow: hidden; position: relative;">
<div class="getProducts_Cover" style="width:56950px; position: absolute; height:50px;">
<div class="getProducts_Page" style="display: block; width: 850px; float: left; height: 50px; color: #000;">
<h1>2012 - January Newsletter</h1></div>
</div></div></div></div>

Chrome在那里显示它，它概述了它，它甚至告诉我宽度/高度，但我实际上看不到文字。我把它放到一个 HTML 页面中，我仍然看不到它。我一定是在某处遗漏了一条 CSS 规则。

Answer 1

嗨，你可以删除overflow:hidden;

<div id="getTheProducts" style="clear: both; margin-top: 15px; margin-bottom: 15px; border: 1px solid #DDD;background-color: #f8f8f8; width: 857px; height: 50px; text-align: left;">
<div class="clear"></div>
<div id="getProductsSlide" style="width: 850px; position: relative;"> // **here remove overflow hidden**
<div class="getProducts_Cover" style="width:56950px; position: absolute; height:50px;">
<div class="getProducts_Page" style="display: block; width: 850px; float: left; height: 50px; color: #000;">
<h1>2012 - January Newsletter</h1></div>
</div></div></div></div>

Answer 2

禁用标题显示的是position: absolute; 在

<div class="getProducts_Cover" style="width:56950px; position: absolute; height:50px;">

如果可能，将其更改为

<div class="getProducts_Cover" style="width:56950px; position: relative; height:50px;">