Horizontal Rule with Gradient Fade Out of Ends

This is the CSS code to make a horizontal rule look more artistic with ends fading into the page.

hr {
	margin:10px auto;width:95%;height:0.9px;
	background-image:-webkit-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0));
	background-image:-moz-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0));
	background-image:-ms-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0));
	background-image:-o-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0))
}

Example:

CSS:

hr {
    margin:10px auto;width:95%;height:0.9px;
    background-image:-webkit-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0));
    background-image:-moz-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0));
    background-image:-ms-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0));
    background-image:-o-linear-gradient(left,rgba(100,100,100,0),rgba(100,100,100,.85),rgba(100,100,100,0))
}

HTML:

<!-- just put the <hr> tag where you want it... -->

Produces the result: