Google Answers Logo
View Question
 
Q: HTML / CSS make a border around a font / text ( No Answer,   1 Comment )
Question  
Subject: HTML / CSS make a border around a font / text
Category: Computers > Internet
Asked by: trimidium-ga
List Price: $3.00
Posted: 02 Jan 2003 12:32 PST
Expires: 01 Feb 2003 12:32 PST
Question ID: 136576
What I am doing is converting a website: http://www.thesmartass.info/
to a dynamicly generated website.  I have embeded a font that I need
and now I want it to have a border around it like it did when I made
the website from graphics in photoshop.

If I were to type "Hello"  I would like it to say hello in black with
a white border around each black letter.  So my question could be
answered by either some sort of code or script that puts a stroke
around the letter or a way to put a layer of text underneath another
layer of text for of a slightly different size (illusion of a border).
 Please view website as it is right now to get an example of what i
want... http://www.thesmartass.info/

Request for Question Clarification by webadept-ga on 02 Jan 2003 12:46 PST
I'm more curious than anything else, which scripting language are you
going to use for the dynamic creation? This will help a researcher
answer your question if one decides your bid is worth the time to
create this, and help you get an answer you can use.

Clarification of Question by trimidium-ga on 02 Jan 2003 13:29 PST
When the page gets done it will be in php and css.  However that
should not really matter, i want basically a property for a font that
adds a border around the text without having to save it as a graphic. 
In theory i found code in css that goes "font: border;" however that
code didn't work.

Request for Question Clarification by webadept-ga on 02 Jan 2003 15:08 PST
No, that wouldn't work.. 

What you are going to need is a script that creates the text twice,
using layers, as you guessed in your question. This is why I was
curious. I'm sure it is possible to do, it wouldn't look exactly like
your current page, because the text would be "cleaner", you would see
the white space in the holes of B's and O's and that sort of thing.

The PHP is going to need to read the file of text for the area, do a
bit of math with letter spacing and line size, send out one layer in
bold white, and then over that, a smaller fontsize, spaced right in
bold black. The letter spacing is going to be the trick for the top
layer.

This function or method would probably present some problems inside
tables. These are just hints because I thought your idea was pretty
cool and your website looked good as well. It's good also that you are
looking to go to a more text based layout, rather than all those
images paneling out. Off the top of my head however, the functioning
of this is not going to be an easy thing to write, and I wish you luck
on it.
Answer  
There is no answer at this time.

Comments  
Subject: Re: HTML / CSS make a border around a font / text
From: prophet-ga on 03 Jan 2003 09:29 PST
 
This is a very simple way to do something similar using filters,
although the results are not exactly what you're asking for.

Maybe it works for you though, so here it is...

<html>
<head>
<style type="text/css">
.bordered {color:#FFFFFF;font-family:arial;font-size:12pt;font-weight:bold;width:
inherit; height: 12; Filter: Glow(Color=#000000, Strength=4);}
</style>
</head>
<body>
<b class="bordered">&nbsp;test&nbsp;</b><br>
</body>
</html>

Important Disclaimer: Answers and comments provided on Google Answers are general information, and are not intended to substitute for informed professional medical, psychiatric, psychological, tax, legal, investment, accounting, or other professional advice. Google does not endorse, and expressly disclaims liability for any product, manufacturer, distributor, service or service provider mentioned or any opinion expressed in answers or comments. Please read carefully the Google Answers Terms of Service.

If you feel that you have found inappropriate content, please let us know by emailing us at answers-support@google.com with the question ID listed above. Thank you.
Search Google Answers for
Google Answers  


Google Home - Answers FAQ - Terms of Service - Privacy Policy