0

清除我使用过的浮点数时遇到问题，我不明白为什么它不起作用。

我在三列布局中获得了一些信息，我尝试清除浮动，以便我可以继续在下面添加信息，但它不会在下面。

HTML

<div class="aboutme">
<h1>About Me</h1>
<p>
<br>
<br>
<a>My name is <strong>Richard Warner</strong> and I am a young web designer from          Birmingham, UK. I have recently graduated from Manchester Metropolitan University having studied BSc(Hons) Multimedia Computing</a>. 
</p>
</div>

<div class="skills">
<h1>Skills & Expertise</h1>
<p>
<br>
<br>
<ul id="skilllist">
<li><a>HTML & CSS</a></li>
<li><a>PHP</a></li>
<li><a>MySQL</a></li>
<li><a>Wordpress</a></li>
<li><a>Adobe Photoshop</a></li>
<li><a>Adobe Dreamweaver</a></li>
</ul>
</p>
</div>

<div class="cv">
<h1>My CV</h1>
<p>
<br>
<br>
<a>You can download my CV by clicking here</a>
</p>
</div>

</div>
<div id="clear"></div>
<div id="portfolio"><a>addsassadasd</a>
</div>

CSS

.aboutme {
width: 300px;
height: 210px;
border: solid 1px #000;
float: left;
}

.skills {
width: 300px;
height: 210px;
border: solid 1px #000;
float: left;
margin-left: 27px;
}

.cv {
width: 300px;
height: 210px;
float: left;
border: solid 1px #000;
margin-left: 27px;

}

#clear {

clear:both;
}

我已检查以确保我已关闭 DIV 标签并且它们都已关闭。任何帮助将不胜感激，谢谢。

4

2 回答 2

1

你有一个额外的</div>接近尾声。预期的行为是什么？您在jsFiddle上的代码似乎确实按照应有的方式呈现。清除 div 之后的所有内容都低于其上方的浮动元素。

<div id="clear"></div>
<div id="portfolio"><a>addsassadasd</a>
    This is below the floats above<br>
    Not a word of a lie
</div>
于 2013-05-27T20:02:18.223 回答
0

如果有帮助，请检查：

http://jsbin.com/ofunas/4/

CSS：

.aboutme {
width: 300px;
height: 310px;
border: solid 1px #000;
float: left;

}

.skills {
width: 300px;
height: 310px;
border: solid 1px #000;
float: left;
margin-left: 27px;
}

.cv {
width: 300px;
height: 310px;
float: left;
border: solid 1px #000;
margin-left: 27px;

}

#clear {
display:block;
clear:both;
}
.div4 {
width: 300px;
height: 310px;
border: solid 1px #000;
float: left;
margin-top:20px;
}
于 2013-05-27T20:07:52.310 回答