CSS Examples: clear

Examples

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sit amet diam. Duis mattis varius dui. Suspendisse eget dolor. Fusce pulvinar lacus ac dui. Praesent ullamcorper, turpis ut tempus tincidunt, odio purus blandit ipsum, vel scelerisque metus leo eget massa. Aliquam erat volutpat. In ultrices mi nec erat. Nulla facilisi. Vivamus a tellus ut risus accumsan accumsan. Donec sed sapien quis arcu auctor tincidunt. Curabitur in est eget diam posuere varius. Fusce mollis auctor nulla. Donec ac augue at massa interdum porta. Mauris eu ipsum. Curabitur ut orci vel purus mollis tempus. In at velit in erat laoreet ultricies. Integer libero.

This is a left clearing headline.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus sit amet diam. Duis mattis varius dui. Suspendisse eget dolor. Fusce pulvinar lacus ac dui. Praesent ullamcorper, turpis ut tempus tincidunt, odio purus blandit ipsum, vel scelerisque metus leo eget massa. Aliquam erat volutpat. In ultrices mi nec erat. Nulla facilisi. Vivamus a tellus ut risus accumsan accumsan. Donec sed sapien quis arcu auctor tincidunt. Curabitur in est eget diam posuere varius. Fusce mollis auctor nulla. Donec ac augue at massa interdum porta. Mauris eu ipsum. Curabitur ut orci vel purus mollis tempus. In at velit in erat laoreet ultricies. Integer libero.

This headline clears both.

Styles Used

.left {
	border: 1px solid black;
	clear: left;
}
.both {
	border: 1px solid black;
	clear: both;
}