|
Printed
from BasicTips.com,
FREE helpful articles
and tips for Webmasters and Business Owners
Copyright © 1994-2006
by BasicTips.com, a division of BasicTemplates.BIZ
All rights reserved. Republication in whole or in part in any form is not permitted.
Sponsored by BasicTemplates.BIZ
Website
Templates with External CSS and
Removable Graphics
http://www.BasicTemplates.biz
Co-Sponsored by Effective-Website-Secrets.com
Teaching webmasters effective web development and marketing techniques
via free podcasts.
http://www.Effective-Website-Secrets.com
Category: CSS
Newspaper Column Effect: Justified Page Text
By BasicTemplate with External CSS
This article will teach you how to easily justify all of your page text so that
it replicates newspaper columns. We will be referring to code that will be placed
within an "external" stylesheet. You may want to familiarize yourself with why
"external" style sheets are the most effective and logical way to design a web
site (rather than internal or inline), by first reading our article, "External,
Internal or Inline? Which Method is Best?".
|
Personally and with all due respect, I do not like to see the page
text justification property excessively used on the web. It has
a way of shouting unprofessional and inexperienced.
If you take a look around the web, you will find that not many
sites with any great degree of popularity use this technique for
all of their page text. And for good reasons. One important fact
you should be aware of is that full page text justification is difficult
for many folks to read on a computer screen. One of the biggest
mistakes made by many new designers is assuming that what works
for the print industry will work for the web. That is not true in
many ways.
Just because something looks cool, does not mean it is the wisest
choice.
|
| Center Justified Page Text |
What you will find on your web search, however,
are newbie designers who use this effect to the point where everything
they design is justified. Another design blunder is center justifying
page text as illustrated in this paragraph.
You will also find that the big sites like Google, Yahoo, Amazon,
Microsoft, Netscape, CNN, etc. do not use this effect for full page
text justification.
Granted there are situations where you might want to use this newspaper
column effect especially if you are a newspaper, right? Maybe. :)
But keep in mind that if CNN does not use it, why use it on the
site you are designing for Joe's Print Shop?
|
The CSS code to create this effect is quick and easy.
Add the text-align code to the body, p, and td tags as shown to your external
style sheet. If you purchased a web template that has this effect, and
you don't like it, the code in red below
is what you need to look for so you can easily delete it.
body { text-align: justify}
p, td { text-align: justify}
|