Home | Sitemap | Log in - Register now (free)
imageHome : Internet : Articles : Article Formatting Demo 1 - with tables

Article Formatting Demo 1 - with tables

DonaldG DonaldG on 03 July, 2008 19:29:00 | 259 times read
  • email Email to a friend
  • print Print version
  • Add to your del.icio.us del.icio.us
  • Digg this story Digg this

Did you enjoy this article?

(total 0 votes)

Newsletter

Subscribe to newsletter:

Poll: memory

How much memory in your computer do you have?
Poll results
Adjust font size: Decrease font Enlarge font
image

 TEST FORMATTING ARTICLE (Gaudy colours intended!)

TABLE 1: 1 Column 1 Row, 650px wide x MINIMUM 525 px high, Vertical Alignment = Top

The use of tables to define shape of article.... A guide, not an absolute rule.
Because of the 'menu' on the right of the published page, it is possible for published articles to bleed over into that area. This means that the area available is irregular in shape. Further, the 'Google Ads' on the right seem to be a variable height with up to 4 ads, this also has to be allowed for. The tables below should, if the wind is in the right quarter, avoid bleeding on to the menu & Ads
The easiest way of avoiding the menu and creating a pleasant appearing shape is to place text & images in THREE, single column, single row tables of specific widths. To see clearly the table bounderies, they have a back ground colour invoked.
TABLE 1: 1 Column 1 Row, 650px wide x MINIMUM 525 px high, Vertical Alignment = Top
TABLE 2: 1 Column 1 Row, 720px wide x MINIMUM 600 px high, Vertical Alignment = Top
TABLE 3: 1 Column 1 Row, 650px wide (no height of vertical alignment need be specified)

No image wider than 650 pixels can go in Table 1 -  625px max preferred
test image 650 pix wide

Test image 625 pixels wide
Be aware that the height of text and or image being inserted in to height specified tables will follow 2 simple rules:
(a) if the text/image being inserted that is smaller in height than the table height, the table will remain at the height defined.
(b) If the text/image exceeds the height of the table, the table height will automatically be adjusted to meet the needs of the text.

If excessive text is placed in table 1 and or 2, the auto expansion in their height will effect the height position of the subsequent tables.

Of course, there is nothing to say that you cannot use a table Just 650 wide for all the text. Be aware of the image width limitations!
See Tables 4 & 5 below.
 

TABLE 2: 1 Column 1 Row, Max 720px wide x MINIMUM 600 px high, Vertical Alignment = Top
The height of this table must allow for up to 4 Google ads on the right.

No image wider than 720 pixels can go in Table 2 -  700px max preferred

test image 720 pixels wide

Test image 700 pixels wide

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque auctor odio a sem. Integer sit amet sapien. Integer laoreet urna eu nisl. Morbi vestibulum. Praesent venenatis. Quisque dictum sem eu ante. In orci lacus, condimentum non, ornare vitae, luctus sit amet, nisl. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nunc et sapien. Donec in enim ut nisi vestibulum auctor. Vivamus mi. Quisque imperdiet nisl iaculis turpis. In ligula.
Ut sollicitudin nunc eget erat. Etiam molestie lacus id sapien. Vivamus ante. Vivamus ac orci at eros elementum adipiscing. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed vel lorem. In accumsan adipiscing tortor. Vestibulum in magna id lectus interdum scelerisque. Fusce adipiscing eleifend nisl. Morbi fermentum volutpat ligula. Sed suscipit, justo ac sodales laoreet, sem augue blandit lorem, non gravida nunc mi id augue. Nulla sed leo. Duis imperdiet, quam id congue bibendum, purus sapien porttitor orci, et sollicitudin eros dui nec quam. Duis non sem. Aenean posuere pulvinar urna. Pellentesque eget sapien. Morbi in nunc.
TABLE 3: 1 Column 1 Row, 840px wide (no height of vertical alignment need be specified)

No image wider than 840 pixels can go in Table 3 - 800px max preferred

Test image 840 pix wide

Test image 800 pixels wide
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque auctor odio a sem. Integer sit amet sapien. Integer laoreet urna eu nisl. Morbi vestibulum. Praesent venenatis. Quisque dictum sem eu ante. In orci lacus, condimentum non, ornare vitae, luctus sit amet, nisl. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nunc et sapien. Donec in enim ut nisi vestibulum auctor. Vivamus mi. Quisque imperdiet nisl iaculis turpis. In ligula.
Ut sollicitudin nunc eget erat. Etiam molestie lacus id sapien. Vivamus ante. Vivamus ac orci at eros elementum adipiscing. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed vel lorem. In accumsan adipiscing tortor. Vestibulum in magna id lectus interdum scelerisque. Fusce adipiscing eleifend nisl. Morbi fermentum volutpat ligula. Sed suscipit, justo ac sodales laoreet, sem augue blandit lorem, non gravida nunc mi id augue. Nulla sed leo. Duis imperdiet, quam id congue bibendum, purus sapien porttitor orci, et sollicitudin eros dui nec quam. Duis non sem. Aenean posuere pulvinar urna. Pellentesque eget sapien. Morbi in nunc.

Table 4
This table is set for 600 pixels wide, 0 cell space & padding
It is a visual guide to see what 600 looks like and compare with table 5.
The next table, table 5,  is also defined as 600 pixels wide but it expanded to the width of an oversize image


Table 5
This table is defined to be 600 pix wide. The defining command was ignored when an image larger than 600 is inserted.
It automatically resizes itself to the largest width of image inserted.

Test image 800 pixels wide


  • email Email to a friend
  • print Print version
  • Add to your del.icio.us del.icio.us
  • Digg this story Digg this

Post your comment comment Comments (0 posted)