I was trying to design this:
the css used for this is:
.body {
border: 5px solid red;
padding: 10px;
}
.one {
float: right;
height: 100px;
width: 100px;
}
.two {
float: left;
height: 100px;
width: 100px;
}
p {
clear:right;
}
but if i use this code the output is:

but it works fine if i remove
p {
clear:right;
}
The clear property controls the flow next to floated elements. when you set clear:right; it will be pushed below the right floated elements;