我一直在这里寻找一些时间,但仍无法找到解决问题的方法。
我正在尝试建立一个网站,其中我有一个主要div,其中2个div制作2列,问题是:我希望主div识别它们的高度并自动调整,以保持完美。但我的主要部分只是忽略了一切,我的网站变得奇怪。
另外,这是我的测试页面,所以你可以看到我在说什么:http://dayzsa.bl.ee/
到目前为止,这是我的代码:
CSS
body {margin:0; }
div.header {
width:100%;
height:90px;
margin:0;
background:#CCC;}
div.content {
width:100%;
height:100%;
min-height:350px;
max-height:500px;
margin:0;
border-bottom:1px dotted #000;
background:#999; }
div.footer {
background:#333;
width:100%;
height:100%;
max-height:250px;
min-height:200px;
margin:0; }
div.content-company {
width:100%;
min-width:900px;
max-width:1400px;
margin:0 auto;
height:100%;
padding:25px 15px;
background:#C90; }
div.content-company-left {
width:51%;
padding:0 25px;
height:100%;
float:left;
text-align:justify;
background:#300; }
div.content-company-right {
width:45%;
height:100%;
float:left;
background:#F6F; }
HTML
<div class="header"><!-- menu goes in here --></div>
<div class="content">
<div class="content-company">
<div class="content-company-left">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
<div class="content-company-right"><img src="img.png" border="none" width="100%" /></div>
</div>
</div>
<div class="footer"><!--footer goes in here -->
如果有人知道如何帮助我,我会感谢你。
答案 0 :(得分:0)
在课程overflow:auto
中使用.content-company
。
答案 1 :(得分:0)
在主div css规则中添加浮点数:
div.content-company { float:left }
并且无需添加height:100%