Articles with tag: css float

How To Stop Element From Overlapping – CSS

–Notice to the .clearfloat class–

[html]

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
div {
border:1px solid black;
padding:25px;
}
img {
border-right:1px solid #999;
border-bottom:1px solid #999;
float:left;
padding:1px;
}
p {
float:right;
width:87%;
}
.clearfloat:after {
content: ".";
display:block;
height: 0;
clear:both;
visibility:hidden;
}
/* CSS for IE6 */
*html .clearfloat {
height: 1%;
}
/* CSS for IE7 */
*:first-child+html .clearfloat {
min-height:1px;
}
</style>
</head>

<body>
<div class="clearfloat">
<img src="put an image address here" />
<p>asdasd asdasd asdaskndfs kdsgjdkf asjdewifk asdksa;kfdf samdksajdd, asdhasjdhdsfksdfjsd
asjdjasdasdm,asdnas
as,dma.,sdma.,sdma.sd ijjfsdkj
</p>
</div>
</body>
</html>

[/html]