内容重叠div [英] Content overlapping div

问题描述

我遇到重叠内容的问题。当我尝试这个代码为HTML，content_left内的文本重叠我想要它包含的整个区域。当我把高度改为自动，它不能解决问题..内容重叠到右边和底部被切断。

I'm having issues with overlapping contents. When I try this code for the HTML the text within content_left overlaps the entire area i want it to contain. When I change height to auto, it does not solve the problem.. Contents overlap to the right and the bottom is cut off.

<div id="wrapper">

  <div id="header">

        <div id="logo">
        </div>

        <div id="header_right">
        </div>
  </div>
<div class="content_left">   
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
 hfhfhfhfhfhfhfhfhfhfhffhfhhfhfhfhfhfhfhfhfhfhfhffhfh
</div>

<div class="content_right">
</div>

 <div class="footer">
     Footer goes here 
 </div> 
</div> 

CSS

#wrapper {
 height: 1500px;
 margin: 20px auto auto auto;
 padding: 0;
 background: url(wrapper.png);
 }

 .content_left {
 float: left;
 width: 600px;
 padding: 20px 0 0 30px; 
 margin-left: -300px;
 position: relative;
 height:auto;
 }

例的 jsfiddle示例

推荐答案

因为字符串中没有空格

 .content_left{overflow:hidden;}

我认为任何有效的字符串（word）只要你的

and i dont think any valid string(word) as long as yours

这篇关于内容重叠div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！