CSS Way: Horizontal Rule

Definition and Usage
The <hr> tag defines a thematic break in an HTML page (e.g. a shift of topic).
The <hr> element is used to separate content (or define a change) in an HTML page.
Default hr tag is ugly. So, let's use CSS instead. :P

Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>HR</title>
<style type="text/css">
.hr{border-bottom:1px solid #555;border-top:1px solid #111;display:block;font-size:1px;height:0;line-height:0;margin:0}
body{background: #343434; color:#fff}
div.wrap{ width:800px; margin:250px auto; text-align:justify}
</style>
</head>

<body>
<div class="wrap">
This blog is a personal blog written and edited by mattmorz. This blog accepts forms of cash advertising, sponsorship, paid insertions or other forms of compensation.
The compensation received will never influence the content, topics or posts made in this blog. All advertising is in the form of advertisements generated by a third party ad network. Those advertisements will be identified as paid advertisements.
<div class="hr"/>
</div>
Default HR is not pretty.
<hr/>
</body>
</html>

Here's the demo.
Use <div class="hr"/> where you want it to appear.

Popular posts from this blog

Add/Subtract Single Digit Number in Assembly Language

Set table width to 100% on PDF export in Datatables

Hot/Cute flat-chested Girls