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

Self

[xm177e2]

Just a test, to see what a reply looks like.

[xm177e2]

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

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

[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

In a word.....

Yuck!

[Dan Day]

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...

[lowbridge]

Lowbridge rules!

[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

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?

[hole_n_one]

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.

[Dan Day]

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.

[hole_n_one]

IE

WIN 98

[hole_n_one]

It looks fine with Netscape

[gjeiii]

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.

[MississippiMan]

Yet another test.

[Denver Ditdat]

bump

[mercy]

Ditto here. Using Windows 95 and Nescape 4.7

[Benoit Baldwin]

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.

[1John]

Hmmmm........

[Benoit Baldwin]

>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.

[LiveFree2000]

Get Bent

[George W. Bush]

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.

[Benoit Baldwin]

>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 -->    

[George W. Bush]

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.

[LarryLied]

Had to scroll right to left with Mac OS 8 with Netscape 4.5

[Benoit Baldwin]

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.

[Benoit Baldwin]

>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.

[Benoit Baldwin]

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.

[George W. Bush]

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.

[RnMomof7]

I am so lost

[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??

[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??

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...

[Thinkin' Gal]

I am so lost

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

[George W. Bush]

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.

[RnMomof7]

Well twill not be ME!.....hey gal...

[RnMomof7]

Those are for a windows OS..I have a Mac OS..if I try it all I see are the commands

[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?

[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?

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.

[RedWing9]

Thanks GW...

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

Anyone with ideas?

[George W. Bush]

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!

[RedWing9]

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.

[RedWing9]

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;
}

[George W. Bush]

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.

[steveegg]

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.

[steveegg]

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 .

[George W. Bush]

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.

[George W. Bush]

...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.

[steveegg]

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.

[537 Votes]

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.

[RedWing9]

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.

[RedWing9]

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.