Alaska Software Inc. - Cheap trick
Username: Password:
AuthorTopic: Cheap trick
Bruce AndersonCheap trick
on Wed, 22 Apr 2009 11:47:19 -0500
Tasteful design often employs a horizontal rule with a title inserted in the 
middle of it as a way to set off a section of a form.  However, the <hr /> 
tag does not accommodate inserting the text, and trying to do it with two 
<hr /> tags is clumsy.  Here is a fake.

Use the <img> tag to make the lines by giving it no image file for the 
source.  Make the title attribute an empty string.  Use background color for 
the line color and height for thickness.  Presto, you have a stylish divider 
on your form.  Example follows:

<table>
    <tr>
        <td colspan=2 style="text-align:center; color:#ff0000;" >
            <img style="vertical-align:middle; background-color:#0000ff;" 
alt="--" title="" src="" width="100" height="3" >
            &nbsp;MY TITLE&nbsp;
            <img style="vertical-align:middle; background-color:#0000ff;" 
alt="--" title="" src="" width="100" height="3" >
        </td>
    </tr>

    <tr>
        <td style="text-align:center; color:#000000;" >Cell 1 text</td>
        <td style="text-align:center; color:#000000;" >Cell 2 text</td>
    </tr>
</table>

Of course, you can stick an actual image in, say, a rainbow slice, and your 
horizontal rule fitted to the height and width attributes will be double 
groovy.  But then, that means you have to come up with the image, rather 
than the cheap promise of an image to be named at a later date like this 
fake is.
Les C. Cseh (ASAP Checks)Re: Cheap trick
on Mon, 21 Dec 2009 21:51:19 -0500
Thanks, Bruce!

Les

"Bruce Anderson" <banderson@graphical-db.com> wrote in message 
news:4c36a5b9$2565d40a$995@news.alaska-software.com...
> Tasteful design often employs a horizontal rule with a title inserted in 
> the middle of it as a way to set off a section of a form.  However, the 
> <hr /> tag does not accommodate inserting the text, and trying to do it 
> with two <hr /> tags is clumsy.  Here is a fake.
>
> Use the <img> tag to make the lines by giving it no image file for the 
> source.  Make the title attribute an empty string.  Use background color 
> for the line color and height for thickness.  Presto, you have a stylish 
> divider on your form.  Example follows:
>
> <table>
>    <tr>
>        <td colspan=2 style="text-align:center; color:#ff0000;" >
>            <img style="vertical-align:middle; background-color:#0000ff;" 
> alt="--" title="" src="" width="100" height="3" >
>            &nbsp;MY TITLE&nbsp;
>            <img style="vertical-align:middle; background-color:#0000ff;" 
> alt="--" title="" src="" width="100" height="3" >
>        </td>
>    </tr>
>
>    <tr>
>        <td style="text-align:center; color:#000000;" >Cell 1 text</td>
>        <td style="text-align:center; color:#000000;" >Cell 2 text</td>
>    </tr>
> </table>
>
> Of course, you can stick an actual image in, say, a rainbow slice, and 
> your horizontal rule fitted to the height and width attributes will be 
> double groovy.  But then, that means you have to come up with the image, 
> rather than the cheap promise of an image to be named at a later date like 
> this fake is.