Novel Paragraph Spacing With CSS

FREE REPORT: "Intrusion to Integrity:
Putting Productivity Back into the Network"

^ click above ^

Web News:

Personal Broadband gets funding boost, new CEO
Personal Broadband Australia (PBBA) has secured a further $12 million in investmentfunding from an Australian shareholder to expand its Sydney-based commercial wirelessbroadband service along the east coast.

The equity funding boost, provided by existing Australian PBBA shareholder Jim Cooney,means PBBA will now operate as a majority Australian-owned company. PBBA was previously majority owned by US technology group, ArrayComm.
Click Here

CommsWorld Surveys Bank Websites
Following several versions of the “phishing” scam, Australia's banks have repeatedly telling customers they have a responsibility to make sure they're visiting the right Website, and to be careful about the links they follow.
Click Here

Mobile video streaming: the killer application for 3G?
Each mobile technology has a killer application. 2G (GSM) have SMS. 2.5G (CDMA and GPRS) have e-mail access. 3G promisses video streaming, but some say it's already here. Is this really the the case?
I was reading about British Telecom developing a streaming technology with Vemotion. Don't we have other technologies out there for this? What about Windows Media, RealOne Player and Oplayo, all already available for mobile devices? Is this Vemotion technology better? So, using a GPRS connection (Vodafone New Zealand), I tried some of these products.
Click Here

01.21.04

Novel Paragraph Spacing With CSS

By BasicTemplates
You have seen this technique used in printed novels and books countless times. The paragraphs are single spaced together instead of double-spaced apart. So how do you get this effect on your web pages? Glad you asked because in this article we explain how easy this effect is to accomplish with the magic of CSS.

I should caution you though that this effect can be difficult for some folks to read on a computer screen. So use it wisely and sparingly.

Because you do not want all of your website's page paragraphs to have this effect, create a custom CSS class like the one below. This code should be placed within your external style sheet. If you are not familiar with the different methods of CSS and how or when to use them, be sure to read our article, "External, Internal or Inline? Which Method is Best?"

.single { text-indent: 25px; margin-bottom: 
                  0; margin-top: 0; }

You can edit the text-index property to however many pixels you want your paragraphs indented. The key properties that render the paragraphs single-spaced are the margin-bottom and margin-top properties which are set to zero.

Now assign the custom class "single" to paragraphs in your web pages that you want single spaced. The HTML source code would look like this:

<p class="single"> Your paragraphs 
                  in this area. </p>

If you want to get even more creative, you can justify your page text so that is resembles the page text of a newspaper. Again, use this effect sparingly as there are major down sides to using this effect on your entire web site.

If you want your custom class "single" to be justified, add the text-align property to the custom class we previously created as shown below:

.single { text-indent: 25px; margin-bottom: 
                  0; margin-top: 0; text-align: justify; }

Click Here to view live comparison examples of both effects and see first hand why you should use these effects with discretion.

Emphasizing A Product With Monochrome Graphics

By BasicTemplates

Nothing stands out better on a website then a product image in full color while the rest of the image and site are monochrome (shades of gray).

Let me give you an example of what I mean. Let's imagine that you have a new client who is a musician, and they just cut their first music CD. You have someone take a high resolution digital photo of your new client holding the CD. With me so far?

Open the high resolution digital photo in your graphics software program and carefully outline just the product (the CD in this scenario) with the free hand selection tool of your software. Most every graphic software program has this option, you just have to know where it is and how to find it if you are not familiar with your software's features. Do a search in the help section of your software if you don't know where to locate it. We've included a few suggested search keywords at the bottom of this article to assist you.

Now invert your selection and apply a monochrome filter. Inverting means that rather than selecting what you initially outlined, you want to select the opposite of that selection which is everything that you did not select.

Get UnixProNews Newsletter Free - ">Click Here

Now look at what you just accomplished with little to no effort. You can use this image as a splash page intro or for the main product photo. What better way to promote a product then de-emphasizing everything but the product and with a photo of the person who developed it? Cool idea? Why not suggest this technique to your next client who has a product they want to sell.

Check out two web templates we have developed in the past with this concept. One of them has an option for a package of swap-out graphics that utilize the same effect. Monochrome Web Templates

Try the following keyword searches within your graphics software to find the tools used in this mini-tutorial: "select", "invert", "invert selection", "monochrome", "monochrome effect", "monochrome filter".

IMPORTANT NOTE: Do no confuse monochrome with grayscale. There is a big difference. That big difference is the number of gray colors in each type of file. Grayscale is a compressed file size that has most of the grays stripped out and leaves you with a minimal amount of gray shades (8-bit). Monochrome on the other hand is True Color (24-bit).

After this article is published I hope to see many websites published in monochrome emphasizing a product. If you develop a well-designed site using this concept, let us know, and we'll link your URL within this tutorial.

About the Author:
BasicTemplates.com designs Website Templates with External CSS and has been providing webmasters worldwide with affordable template designs since 1994. BasicTemplates currently offers 650+ designs which may be purchased individually or get complete access to all templates via an affordable membership plan. Most templates were strategically designed with interchangeable graphics and elements to increase the potential number of design layouts for the end user. Each layout utilizes an external style sheet for easy site maintenance and to ensure fast page load.

Free Newsletters

Part of the iEntry Network
over 4 million subscribers

DevWebProAU

SysAdminNews

TabletPCNotes

Send me relevant info on products and services.

WebmasterFree Downloads

From the Forum:

help, new site design, don't know what to do!!

OK, I have a friend of mine doing me a new site for http://www.future-host.co.uk and there is a big white gap between the top banner/logo, and the main content, does anyone now how to sort this, the site is located here....

Click here