HTML – Some Useful Divider Lines

I just realized that the <hr /> divider line is not longer working in wordpress.com. Luckily i find a very good post which has several pieces of HTML codes to add the divider in WordPress post.

Solid Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:2px solid #FF7500;font-size:0;">-</div> 


 

 
Dotted Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:2px dotted #880088;font-size:0;">-</div>

 

 
Dashed Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:2px dashed #FF00FF;font-size:0;">-</div>

 

 
Double Solid Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:2px double #0000A0;font-size:0;">-</div>

 

 
The following are 3D lines with the same color.
Groove Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:4px groove #008000;font-size:0;">-</div>

 

 
Ridge Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:4px ridge #008000;font-size:0;">-</div> 

 

 
Inset Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:4px inset #008000;font-size:0;">-</div>

 

 
Outset Line

-
<div class="aligncenter" style="width:400px;height:0;border-top:4px outset #008000;font-size:0;">-</div>

 

 
You can also make use of the border-bottom to add the 2nd line.

-
<div class="aligncenter" style="width:400px;height:3px;border-top:2px dotted #FF0000;border-bottom:2px dotted #FF0000;font-size:0;">-</div> 

 

You can find more details the post by Panos. Click the link of wordpress tips at the bottom of the post.

Done =)

Reference:

About these ads

2 thoughts on “HTML – Some Useful Divider Lines

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s