|
How_to_Insert_a_Vertical_Divider_Line_into_Your_Web
| How to Insert a Vertical Divider Line into Your Web
Unlike creating a horizontal vertical line by inserting an
tag, a simple html code is not available to insert a vertical
divider line into your web page.
However, there are two simple ways to insert a vertical divider
line...
1. Create a "Graphic" Vertical Divider Line
You may insert a graphic image (.gif) as your divider line and
align it next to your paragraph. Although you'll be forced to
use this method if you need a divider line that has an odd shape
or color, this is not the most efficient method.
By using a graphic as a divider line, you'll risk the graphic
line not being lined up correctly when others view your web
pages. Also, it could slow loading time for your web page.
This method should only be used if necessary.
2. Create a "Thin" Table to Divide Your Columns
If you simply want a line to divide your web page sections, the
best way to do so is using a table.
Simply create a table between your sections (you may have three
columns with the middle column becoming the divider line.)
You can make the column as small as "1 pixel or percent of
table" wide, or larger if needed.
Also, you can select different colors for this table to match
your web page colors.
This is an easy way to create a divider line, and will not
hinder visitors and page loading time.
Follow the link below to view a sample web page using a table as
the vertical divider line...
http://www.webmastercourse.com/web-design-weekly/vertical-line-di
vider.htm
This page was created using Netscape Composer, and the steps
taken were as follows:
1. Create a three-column table that is 600 pixels in width.
2. Sizes are as follows: Far left column size (18 % of table),
middle column (1 % of table), far right column size (81 % of
table).
3. Changed the color of the middle column to match my text links
(navy blue).
4. Inserted the number "0" into the divider column and made the
number "0" the same color as the column (navy blue). The reason
I did this is because Netscape Composer web pages will not show
a table or column of a table unless it has text within it. Don't
know why, but it's so. I insert the number "0" so that the
divider column will show, but the visitor does not see this
number because I've made it the same color as the column - it's
hidden.
Take these four steps in Netscape Composer to create a vertical
divider line that's neat and easily viewed by your visitors.
You can get very creative with tables!
About the author:
Candice Pardue, editor of Web Design Weekly. Affordable web
design services now available. Go here for details and a FREE
web design quote...
http://www.webmastercourse.com/web-design-services/
|
|
| |
| |