Sep
01
2009

Clearing the <hr /> Tag with CSS That Works in IE

by   |  Posted in Tutorials  |  2 comments

There is nothing more annoying than Internet Explorer. Every time you build a site you usually need to add a few CSS hacks just to make sure it works in IE.

Here is some nice CSS to help anyone who wants to use <hr /> tags to clear sections of their site.

hr.clear {
	background: none;
	border: 0;
	clear: both;
	display: block;
	float: none;
	font-size: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
	}

Just use the following code whenever you want to clear with an <hr /> tag.

<hr class="clear" />

About the author:

A freelance web developer living in Montreal who spends most of his time writing for this site and building Premium themes for WordPress. You can find him on Twitter @bavotasan.

Site5 Affiliate Link
If you liked this, please share it.

Tags: , , , , , , , , , , , , , , ,

Short URL: http://bit.ly/9P5NjE

Discussion 2 Comments

  1. Laura on September 9, 2009 at 10:51 am

    I find IE so annoying sometimes. I have been looking for a way to solve this one for a while. Thx.

  2. nikhil on October 15, 2009 at 11:09 am 
    very good i have learnt more things thank you