Free Republic
Browse · Search
News/Activism
Topics · Post Article

Skip to comments.

Article Template for Free Republic - With Instructions for Usage (BLOCKQUOTE gone; thank you, John)
Self

Posted on 09/29/2001 9:00:56 PM PDT by Benoit Baldwin


Article Template for Free Republic

  • Use to obtain the border and column effect you see here
  • Valid HTML 4.01 Transitional
  • Displays virtually the same in all browsers version 3.x and higher (if not, let me know)

Instructions for Usage

  1. Copy and paste the following HTML into the Text of Article: form, when posting a new article.
  2. Insert the article's HTML into the space noted in the template.
  3. That is all. See Notes on Usage for more information.
   
<!-- BEGIN TEMPLATE -->    
<table bgcolor="#999999" border=0 cellpadding=0 cellspacing=0 width="100%">
 <tr>
  <td width="5%">
   <br>
  </td>
  <td width="55%">
   <table bgcolor="#000000" border=0 cellpadding=0 cellspacing=1>
    <tr>
     <td>
      <table bgcolor="#FFFFFF" border=0 cellpadding="30%" cellspacing=1>
       <tr>
        <td>

         <!-- Put the article's HTML here -->

        </td>
       </tr>
      </table>
     </td>
    </tr>
   </table>
  </td>
  <td width="40%">
   <br>
  </td>
 </tr>
</table>
<!-- END TEMPLATE -->    

Notes on Usage

  • The value in green should be 100%, unless BLOCKQUOTE is imposed on us again, in which case it should be less; 90% or thereabouts.
  • The values in blue, reading the template from top to bottom, affect the width of the left, center, and right columns repectively--adjust to your liking, but their sum should be that of the value in green.
  • The values in purple, reading the template from top to bottom, affect the color of the left and right columns, the center column border, and the center column respectively. I use hexadecimal color values; the English names of the colors may be substituted.
  • The value in brown affects the space (or "padding") around whatever you place in the center column (text, usually). In other words, the margins or whitespace within the center column can be adjusted by changing this value.
  • If the article's HTML contains tables itself, ensure they are properly nested and terminated.
  • Be careful when using PRE--long lines of PRE formatted text will adversely affect the output of this template.
  • The whole purpose of using this template is to enhance an article's readability, mainly by reducing the size of paragraph widths. It is easily customizable to meet the needs of just about any article or taste, but you may find other methods more to your liking.



TOPICS: Announcements; Your Opinion/Questions
KEYWORDS:
Navigation: use the links below to view more comments.
first 1-5051-100101-105 next last

1 posted on 09/29/2001 9:00:56 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | View Replies]

To: Benoit Baldwin
Just a test, to see what a reply looks like.
2 posted on 09/29/2001 9:04:12 PM PDT by xm177e2
[ Post Reply | Private Reply | To 1 | View Replies]


If I put the template in my reply, it looks like this

It isn't causing any problems with my custom CSS. Nice work.

3 posted on 09/29/2001 9:06:40 PM PDT by xm177e2
[ Post Reply | Private Reply | To 1 | View Replies]

To: Benoit Baldwin
The "template" in which you wrote your text required that I scroll from left to right to read an entire sentence ....and then scroll back again, from right to left on order to read another...and so on, and so forth

In a word.....

Yuck!

4 posted on 09/29/2001 9:08:42 PM PDT by hole_n_one
[ Post Reply | Private Reply | To 1 | View Replies]

To: hole_n_one
The "template" in which you wrote your text required that I scroll from left to right to read an entire sentence ....and then scroll back again, from right to left on order to read another...and so on, and so forth

It looked just fine here...

5 posted on 09/29/2001 9:10:10 PM PDT by Dan Day
[ Post Reply | Private Reply | To 4 | View Replies]

To: Benoit Baldwin

Lowbridge rules!


6 posted on 09/29/2001 9:11:30 PM PDT by lowbridge
[ Post Reply | Private Reply | To 1 | View Replies]

To: hole_n_one

>The "template" in which you wrote your text required that
>I scroll from left to right to read an entire 
>sentence ....and then scroll back again, from right to 
>left on order to read another...and so on, and so forth

I had to use PRE in this article--which, as I noted, can cause problems. Which version Web browser and what Operating System are you using?

7 posted on 09/29/2001 9:18:01 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 4 | View Replies]

To: Dan Day
In my case, I can't see the entire sentence on the screen........ the last 2 characters of each sentence are not being shown.......I have a scroll bar showing at the bottom, and must use it to see the entire text.

I'm using IE.

8 posted on 09/29/2001 9:18:33 PM PDT by hole_n_one
[ Post Reply | Private Reply | To 5 | View Replies]

To: Benoit Baldwin

Testing, one two three testing.... I'm going to try typing a really long continuous line here to see whether it wraps properly when posted. Wish me luck.


9 posted on 09/29/2001 9:18:54 PM PDT by Dan Day
[ Post Reply | Private Reply | To 1 | View Replies]

To: Benoit Baldwin
IE

WIN 98

10 posted on 09/29/2001 9:19:10 PM PDT by hole_n_one
[ Post Reply | Private Reply | To 7 | View Replies]

To: Benoit Baldwin
It looks fine with Netscape
11 posted on 09/29/2001 9:21:18 PM PDT by hole_n_one
[ Post Reply | Private Reply | To 7 | View Replies]

To: The powers that be
Does this mean we can no longer just type a message or simply cut and paste an article?

Will there be prizes for the prettiest or neatest postings? regardless of content?

Since I don't spend all day, every day, reading Free Republic, I am confused by what these formatting threads mean to the non-professionals among us.

12 posted on 09/29/2001 9:22:33 PM PDT by gjeiii
[ Post Reply | Private Reply | To 6 | View Replies]

To: Benoit Baldwin

Yet another test.


13 posted on 09/29/2001 9:26:30 PM PDT by MississippiMan
[ Post Reply | Private Reply | To 1 | View Replies]

To: Benoit Baldwin
bump
14 posted on 09/29/2001 9:30:20 PM PDT by Denver Ditdat
[ Post Reply | Private Reply | To 1 | View Replies]

To: hole_n_one
Ditto here. Using Windows 95 and Nescape 4.7
15 posted on 09/29/2001 9:32:03 PM PDT by mercy
[ Post Reply | Private Reply | To 8 | View Replies]

To: hole_n_one
Yes, it's because I used PRE to format the display of the template code. PRE formatted text does not wrap to its container.

If I change my display resolution from 1024x768 to 640x480, I get the effect you are describing.

16 posted on 09/29/2001 9:54:36 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 10 | View Replies]

To: Benoit Baldwin
Hmmmm........
17 posted on 09/29/2001 10:05:39 PM PDT by 1John
[ Post Reply | Private Reply | To 16 | View Replies]

To: gjeiii

>Does this mean we can no longer just type a message or 
>simply cut and paste an article?

No, no, no. This is just a tool I am making available;....


>Since I don't spend all day, every day, reading Free 
>Republic, I am confused by what these formatting threads 
>mean to the non-professionals among us. 
....hopefully easy enough for the non-professional to use.

Just copy and paste.

No one has to use it.

18 posted on 09/29/2001 10:05:51 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 12 | View Replies]

To: Benoit Baldwin
Get Bent
19 posted on 09/29/2001 10:42:59 PM PDT by LiveFree2000
[ Post Reply | Private Reply | To 1 | View Replies]

To: Benoit Baldwin
No one has to use it.
Well, of course not. But we have to see it if others choose to post with it.

If people start setting their left and right margins manually in their style sheets to provide indentation on pages which don't use your TABLE template, then when we view a page with your template, your table tries to use 100% of the space. Which means that it will always overflow on the right side by the same amount as the CSS indent was specified for.

It seems that articles posted in this style need to have a way of determining any pre-existing margin settings and inheriting them properly before determining the width to use for the TABLE template.
20 posted on 09/30/2001 11:29:41 AM PDT by George W. Bush
[ Post Reply | Private Reply | To 18 | View Replies]

To: George W. Bush; John Robinson

>If people start setting their left and right margins 
>manually in their style sheets to provide indentation on 
>pages which don't use your TABLE template, then when we 
>view a page with your template, your table tries to use 
>100% of the space. Which means that it will always 
>overflow on the right side by the same amount as the CSS
>indent was specified for.

True.

This is the problem with using CSS; it's a huge can of worms thanks to the majority of browsers in use today having incomplete or buggy implementations. Most sites use the compromise of tables for layout, and style mostly for fonts and color.

Some posters here copy and paste the text of articles, and insert <p>'s as necessary, while others copy and paste the full HTML source--the latter posts may be adversely affected by CSS in use here.


>It seems that articles posted in this style need to have a
>way of determining any pre-existing margin settings and 
>inheriting them properly before determining the width to
>use for the TABLE template. 

In the case of the template I'm using, the fix is simple: omit the main table's width specification--the main table will then inherit the width of its container, which, in the current situation, is DIV.body.

Here is the default template I'll use from now on. It yields, at 640x480 and 12 point Times New Roman (the default for a majority of users), a paragraph width of roughly 52 characters, and a margin of roughly 2 em (all sans CSS):

 
<!-- BEGIN TEMPLATE --> 
<table bgcolor="#999999" border=0 cellpadding=0 cellspacing=0>
 <tr>
  <td width="5%">
   <br>
  </td>
  <td width="60%">
   <table bgcolor="#000000" border=0 cellpadding=0 cellspacing=1>
    <tr>
     <td>
      <table bgcolor="#FFFFFF" border=0 cellpadding="20%" cellspacing=1>
       <tr>
        <td>

         <!-- Put the article's HTML here -->

        </td>
       </tr>
      </table>
     </td>
    </tr>
   </table>
  </td>
  <td width="35%">
   <br>
  </td>
 </tr>
</table>
<!-- END TEMPLATE -->    

21 posted on 09/30/2001 8:44:02 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 20 | View Replies]

To: Benoit Baldwin
I like that you eliminated the inital <TABLE ... WIDTH=100%>. That should work for me and others with modified stylesheets. Can you post a short sample here to demonstrate what an article will look like?

Did you visit my unofficial FR stylesheet website? You can see some screenshots that will give you an idea of what some of us are trying to do.
22 posted on 09/30/2001 8:52:15 PM PDT by George W. Bush
[ Post Reply | Private Reply | To 21 | View Replies]

To: Benoit Baldwin
Had to scroll right to left with Mac OS 8 with Netscape 4.5
23 posted on 09/30/2001 8:57:58 PM PDT by LarryLied
[ Post Reply | Private Reply | To 7 | View Replies]

Comment #24 Removed by Moderator

To: LarryLied
I screwed up this article by not following my own notes.

PRE should not be used within this template, unless the lines are very short.

25 posted on 09/30/2001 9:14:14 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 23 | View Replies]

To: It is time

>Just a test. Hope it comes out ok. Using Win 98; IE 5.0; 
>17" monitor. I understand this template is to be used at 
>our descretion and only for posting articles. Right? 

Right.

But please use the updated one at post 21.

26 posted on 09/30/2001 9:26:36 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 24 | View Replies]

To: George W. Bush
Here.

Looks fine with or without your style sheet at 800x600 and up.

At 640x480 the text around the photograph disappears into the photograph. This effect could be eliminated by using pixel instead of percentage widths, which I'd rather not do.

I think I'll give this up all together.

The Right Thing To Do is encourage the use of CSS, and that means not using structure--TABLE--to impose style.

27 posted on 09/30/2001 11:51:44 PM PDT by Benoit Baldwin
[ Post Reply | Private Reply | To 22 | View Replies]

To: Benoit Baldwin
The Right Thing To Do is encourage the use of CSS, and that means not using structure--TABLE--to impose style.
I'm not so sure your idea is a bad one. Remember that JohnRob was talking about limiting column widths for readability. Just think about it for a while. Maybe the right solution is to use this for multi-column posts. And that article you posted on the page would have worked better if the picture hadn't been so big. Most threads don't have pictures quite that large in the article.

I tend to think that there is no single perfect solution for all articles. But something like your TABLE template could be pretty useful, especially for some of the long plain-text articles. If I get some time, I might play around with it some more.
28 posted on 10/01/2001 5:38:18 AM PDT by George W. Bush
[ Post Reply | Private Reply | To 27 | View Replies]

To: Benoit Baldwin

I am so lost


29 posted on 10/01/2001 7:36:11 AM PDT by RnMomof7
[ Post Reply | Private Reply | To 1 | View Replies]

To: George W. Bush

What does this mean in my life? will the sun come up tomorow...will I ever be able to hear the call if there is no one to call??


30 posted on 10/01/2001 7:40:01 AM PDT by RnMomof7
[ Post Reply | Private Reply | To 21 | View Replies]

To: RnMomof7
What does this mean in my life? will the sun come up tomorow...will I ever be able to hear the call if there is no one to call??
Before I can interrogate you, you must first tell me what is the sound of one hand clapping? On the other hand, we could just forget about it...
31 posted on 10/01/2001 8:34:48 AM PDT by George W. Bush
[ Post Reply | Private Reply | To 30 | View Replies]

To: RnMomof7
I am so lost

Look at the bright side. We're finding out who all the HTML geeks are. `:-)

32 posted on 10/01/2001 8:50:29 AM PDT by Thinkin' Gal
[ Post Reply | Private Reply | To 29 | View Replies]

To: Thinkin' Gal
Look at the bright side. We're finding out who all the HTML geeks are. `:-)
For some real FR geekiness, visit my unofficial FR stylesheet website.

All your HTML are belong to us.

33 posted on 10/01/2001 9:21:48 AM PDT by George W. Bush
[ Post Reply | Private Reply | To 32 | View Replies]

To: Thinkin' Gal
Well twill not be ME!.....hey gal...
34 posted on 10/01/2001 9:26:20 AM PDT by RnMomof7
[ Post Reply | Private Reply | To 32 | View Replies]

To: George W. Bush
Those are for a windows OS..I have a Mac OS..if I try it all I see are the commands
35 posted on 10/01/2001 9:30:50 AM PDT by RnMomof7
[ Post Reply | Private Reply | To 33 | View Replies]

To: George W. Bush
Those style sheets are cool. I'm just leery about using them because I'm so "used" to the standard.

After I clicked on the link, I saw the FR upload page, is there a way to delete a style sheet that is in use?

36 posted on 10/01/2001 9:38:36 AM PDT by RedWing9
[ Post Reply | Private Reply | To 33 | View Replies]

To: RedWing9
Those style sheets are cool. I'm just leery about using them because I'm so "used" to the standard. After I clicked on the link, I saw the FR upload page, is there a way to delete a style sheet that is in use?
Sure. In fact, I just tested it again. While writing this, I turned off the custom sheet and then re-uploaded it to get back to the custom style. Works fine. Here's how to do it.

On the FR Style Sheet Upload page, you can get rid of any custom style sheet you've uploaded by clicking the Reset button at the top. JohnRob would not leave us in such a possible distress, oh ye of little faith!

Give it a try. Let me know if it works. I wish someone would come up with some better wallpaper choices too. Also, I didn't mention it at the website yet, but instead of using wallpaper, you could just set up three different colors to use instead. Even easier for newbies so they wouldn't even have to edit the wallpaper paths. I'll have to try that one out too so more people can use it. Check back to the website for more on that later today.
37 posted on 10/01/2001 9:54:51 AM PDT by George W. Bush
[ Post Reply | Private Reply | To 36 | View Replies]

To: George W. Bush;Registered;piastas;lowbridge
Thanks GW...

I wish someone would come up with some better wallpaper choices too.

Anyone with ideas?

38 posted on 10/01/2001 10:21:52 AM PDT by RedWing9
[ Post Reply | Private Reply | To 37 | View Replies]

To: RedWing9, John Robinson, RnMomof7, Benoit Baldwin
Thanks, GWB...
Go check my unofficial FR style sheet website again.

I now have a version of it that just uses colors. It's so easy to use that any newbie can do it. It just uses three colors instead of the wallpapers. No user modification required!
39 posted on 10/01/2001 10:58:43 AM PDT by George W. Bush
[ Post Reply | Private Reply | To 38 | View Replies]

To: George W. Bush
This is definetly cool!!!! I'm loving this ability.

I've changed your 4.77 version to use lightsteelblue background with tahoma 10pt and blockquote background to lightyellow with courier new 9pt.

Changes will be made though, I'm reading up on this stuff now at w3.org and, of course, O'Reilly.

40 posted on 10/01/2001 1:00:43 PM PDT by RedWing9
[ Post Reply | Private Reply | To 39 | View Replies]

To: George W. Bush
Interesting...

I was trying to make the blockquotes stand out a little better by removing the color change. I opted for a border style just on the top and bottom. When I use the border statements (last three), I lose my font-family.

Interesting...

DIV.body BLOCKQUOTE
{
    BACKGROUND-COLOR: steelblue;
    FONT-FAMILY: "courier new";
    FONT-STYLE: normal;
    FONT-SIZE: 9pt;
    margin-right: 0;
    PADDING-BOTTOM: 1%;
    PADDING-TOP: 1%;
    padding-left: 1%;
    padding-right: 1%;
    border-style:groove;
    border-top-width: thin;
    border-bottom-width: thin;
}

41 posted on 10/01/2001 1:34:32 PM PDT by RedWing9
[ Post Reply | Private Reply | To 39 | View Replies]

To: RedWing9; steveegg
I've changed your 4.77 version to use lightsteelblue background with tahoma 10pt and blockquote background to lightyellow with courier new 9pt.
Sorry. I'd love to take credit but it belongs to steveegg. I'd love to see what you're doing though. I suspect my color and wallpaper choices are a little lame. I'm just demonstrating the principles. I hope some others will come up with better visuals and let me know about them so I can post better ones for everyone.
I was trying to make the blockquotes stand out a little better by removing the color change. I opted for a border style just on the top and bottom. When I use the border statements (last three), I lose my font-family.

DIV.body BLOCKQUOTE
{
    BACKGROUND-COLOR: steelblue;
    FONT-FAMILY: "courier new";
...
A lot of times, it a tag is unknown or in some way broken, it will "eat" the one that follows. So, if NS4.77 choked on steelblue in BACKGROUND-COLOR, it might eat the FONT-FAMILY. As I understand it, the color names are now considered bad style and we're supposed to specify the colors directly.

Try this chart: O'Reilly Color Name Samples. I can see that the steelblue is actually $4682B4 (this is hexadecimal color notation). I can explain it to you if you like but it basically represents each color specified with two digits Red, two digits Green, two digits Blue: RRGGBB. All the colors are made from these combinations. Black is 000000. White is FFFFFF.

So, try this statement instead: BACKGROUND-COLOR: #4682B4;

If that doesn't help, move the FONT-FAMILY above the BACKGROUND-COLOR in the list and see what (if anything) that changes in the output.

And always be careful of those colons and semicolons. They'll mess you up real quick if you don't keep them matched and paired. If you forget a semicolon, it'll usually eat two tags. If you use an illegal value, it will often eat the one or two tags. For a full chart on which browsers support which features and whether a particular feature on a particular browser has any bugs, I like this chart: The CSS Master List. This chard shows at the very bottom, for instance, that Netscape 4 has Bugs in using color keywords like steelblue.

I'd better shut up before you learn all my tricks.
42 posted on 10/01/2001 2:34:22 PM PDT by George W. Bush
[ Post Reply | Private Reply | To 41 | View Replies]

To: RedWing9
When I use the border statements (last three), I lose my font-family.
Netscape 4.7x doesn't accept borders (in fact, it really fouls things up if you pair, say, an outset and inset). One thing to add to GWB's response; it looks like there's no space between the colon and the groove in your posting of the DIV.body BLOCKQUOTE.
43 posted on 10/01/2001 4:41:05 PM PDT by steveegg
[ Post Reply | Private Reply | To 41 | View Replies]

To: RedWing9; George W. Bush
Got things working. Steelblue is a valid color in Netscape 4.77 (at least my version). Still want to verify certain problems with the style sheet (some threads haven't been fully-loading with the background version) before I go and send out the NS 4.77 version of the colors .
44 posted on 10/01/2001 5:06:33 PM PDT by steveegg
[ Post Reply | Private Reply | To 41 | View Replies]

To: steveegg
Netscape 4.7x doesn't accept borders (in fact, it really fouls things up if you pair, say, an outset and inset).
Actually, the chart at WebReview shows that 4.6 does support those border styles (groove, ridge, inset, outset, etc.) in 5.5.17. But then further down in 5.5.22, it says that 4.6 does Paritally supports border-style and has a Buggy border-width. How much of that was fixed before 4.77, I have no idea. I guess it's hit and miss. I wish I could find a better and more complete CSS compatibility chart.
45 posted on 10/01/2001 5:06:57 PM PDT by George W. Bush
[ Post Reply | Private Reply | To 43 | View Replies]

To: steveegg
...send out the NS 4.77 version of the colors
I'm waiting to post it. I'm sure you saw that I revamped the website and I'm all ready for the last few versions. Then we'll put a sidebar story up and invite everyone to try these things out.
46 posted on 10/01/2001 5:09:54 PM PDT by George W. Bush
[ Post Reply | Private Reply | To 44 | View Replies]

To: George W. Bush
Give me a moment to organize files and add an explanation or two in the NS 4.7 version. While I do, be advised of a couple of things. First, I did manage to get borders working after a fashion in NS 4.7 (it's way too much work to properly implement border styles, and it still doesn't work properly with background images rather than background colors). Second, with ANY CSS, NS 4.7 doesn't quite load certain threads completely. I can't figure out why it doesn't, but it doesn't. I included that warning in the style sheet.
47 posted on 10/01/2001 5:27:03 PM PDT by steveegg
[ Post Reply | Private Reply | To 46 | View Replies]

To: Benoit Baldwin
I'd like to see a table limiting text width to 450 pixels, but other than that, I don't see what the problem with our current system is.
48 posted on 10/01/2001 5:36:35 PM PDT by 537 Votes
[ Post Reply | Private Reply | To 1 | View Replies]

To: George W. Bush;steveegg
Okay. I'm just one of those old COBOL programmers :), love "wording" my code.

I got most of my coding ideas from the O'Reilly page I linked earlier and Netscape Developer, since I use Netscape almost exclusively at FR. Left, Right, Top, and Bottom Width tags are mentioned, so I gave them a try. But I'm thinking they are a buggy implementation.

I did try to move the order of the tags around, tried different values, etc, but I still didn't have any luck. So, even though having the top and bottom lines around a block quote looks fantastic to me, I think I may give up on it. Of course, this depends on what steveegg found.

Finally, steveegg, I did correct that "missing space" after the semi-colon in the border-style tag, but it didn't help.

49 posted on 10/01/2001 5:46:05 PM PDT by RedWing9
[ Post Reply | Private Reply | To 42 | View Replies]

To: 537 Votes
There isn't a problem. Well...a few things, but those are on the "fix it" block.

The whole purpose of style sheets are to allow for personal choices, like background colors, fonts and the like. And the true beauty is that you and I to have the freedom to implement them, or not. They are not going to be required. Consider it an option, like leather or cloth seats in a car.

50 posted on 10/01/2001 5:56:16 PM PDT by RedWing9
[ Post Reply | Private Reply | To 48 | View Replies]


Navigation: use the links below to view more comments.
first 1-5051-100101-105 next last

Disclaimer: Opinions posted on Free Republic are those of the individual posters and do not necessarily represent the opinion of Free Republic or its management. All materials posted herein are protected by copyright law and the exemption for fair use of copyrighted works.

Free Republic
Browse · Search
News/Activism
Topics · Post Article

FreeRepublic, LLC, PO BOX 9771, FRESNO, CA 93794
FreeRepublic.com is powered by software copyright 2000-2008 John Robinson