Today is a Holiday in California
Cesar Chavez Still Inspires MarchersToday is a holiday for California state workers, a day to honor Cesar Chavez who founded the National Farm Workers Association in 1962. He is credited with improving wages and working conditions for thousands of California Latinos. Chavez died in April of 1993. Our cousin, Al Rojas, is a former top aide to Cesar Chavez and speaks at commemorations of the life of the United Farm Workers leader. Along with Chavez he helped the Latino and immigrant people who work in the nation's fields and orchards. Today he is featured in the Sacramento Bee article Cesar Chavez Still Inspires Marchers
Tomato
To honor Cesar Chavez we are using the color Tomato and the nice, but not always rendered, Papyrus font.
YOUR TEXT HERE
Copy and paste (or type) this in your Blog or Web page.
It will look like this.
YOUR TEXT HERE
Is Cesar Chavez Day observed in your state? Do you have a holiday that is unique to your area?
Reusing Fabric: Images and Borders
I just came back from visiting Joel where he frames just about everything in the color named gold. And I'm beginning to think that even the piece of fabric will look good bordered in gold. Ha, and it does. But this post isn't really about gold or the fabric. It's about reusing images. One image (our scanned fabric) that is 11K is worth repeating. It only costs the first time we load it. Each display after the first costs little, nearly nothing in bandwidth. It's already in cache (pronounced the same as cash). A cache strategy for images still makes sense on the Web and in Blogworld where there are still folks on dialup. And we all want fast-loading pages.
Borders made with code are cheap - HTML and CSS takes very little time to load. Reusing images and applying borders is a way to make your page load faster.
If you plan a post for the first day of the month like Bryk does the image reuse starts making even more sense. Google tends to send visitors to archived pages. And since we archive monthly, reusing the same image during the month will make that full month page for March load even faster.
CSS Border: 1 pixel solid gold
A simple border only needs the style="border:1px solid gold;" added to the IMG tag.

Copy and paste (or type) this in your Blog or Web page.
It will look like this.

CSS Border: 5 pixel solid gold
A simple border only needs the style="border:5px solid gold;" added to the IMG tag.

Copy and paste (or type) this in your Blog or Web page.
It will look like this.

Dotted Border 2 pixel gold

Copy and paste (or type) this in your Blog or Web page.
It will look like this.

Copy and paste (or type) this in your Blog or Web page.
Dashed Border 1 pixel gold

It will look like this.

Matted Style Border gold
This image with a frame and matte is coded for floating an image to the left with padding of 10 pixels between the image and the text. You can copy the code (image included) and use it as it is. Or copy the code and then insert the name of your image and the width and height of your image. The rest of the code doesn't need to be changed.
Copy and paste (or type) this in your Blog or Web page.
It will look like this.
YOUR TEXT GOES HERE
There's more about CSS Borders and Mattes with copy and paste centered borders using white mattes and other colors. This example uses a span with padding to put the gold around the image and then a solid black border around the image.
BY MICHELLE GOODRICH(April 2004)
I wrote this for my friend who bought his first PC a few months ago. He's technical but more so in the mainframe arena. His questions about how to make his PC run faster and better made me realize that some people don't know the basics (and if I've left anything out please let me know).
Our PC is more than three years old so I ordered a replacement yesterday. It gets pounded full time and the hard drive is beyond repair. The CD drive was clobbered when Sammy put a floppy disk in it and successfully shut it. It's humming with every start of Adobe. Overworked and tired. Or is that me? Either way, the new PC will be here this week (1 Gig of RAM!) and I took the week off work so we'll both get a rest.
CSS BOXES and BORDERED IMAGES (Part 2)
From the Desk of Gary WilliamsToday's Meg lesson is about using <DIV> frames for an image. Over at Mandarin Design, Meg shows us how and then comments that the image looks better with a white background, despite all the framing work.
I think the key is to lighten up the background. Here's the Mandarin original and then two with my suggestion:

Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a
rest home a few months ago and the old farm house was abandoned.
The developers are cleaning out generations of "trash". We found
some fabric and a hand-made doll that was in the room where Andy's
mother used to live.
Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a
rest home a few months ago and the old farm house was abandoned.
The developers are cleaning out generations of "trash". We found
some fabric and a hand-made doll that was in the room where Andy's
mother used to live.
Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a
rest home a few months ago and the old farm house was abandoned.
The developers are cleaning out generations of "trash". We found
some fabric and a hand-made doll that was in the room where Andy's
mother used to live.
If you right-click and look at the source, you can see that I've made the background the same tone, but lighter in color. Or you can go over to Mandarin and look at Meg's code,which is the same as what I used here and just replace the background colors with the ones I show here:
The original
background is taken from the base of the picture:
#8BB4AE.
The
middle one is lighter, by one tick: #9BC4BE.
The lowest one is better, I think: #BBE4DE.
Notice that I'm keeping the overall grey-tone the same by increasing all three parts of the RGB (red-green-blue):
8B to 9B to BBB4 to C4 to E4AE to BE to DE
This way you can see that the colors are related, but lighter, and that makes the image and the background relate (IMHO...).
End of Gary's Post
Making Hexadecimal Colors as Clear as Mud
We can see that Gary went from the original #8BB4AE to lighter #9BC4BE and then even lighter #BBE4DE , increasing each hexadecimal RGB (red, green, blue) color column.
#8BB4AE
#9BC4BE
#BBE4DE
Colors are expessed in hexadecimal, a base-16 number system which means that it is made up of 16 unique symbols.
Hexadecimal Numbers
0
1
2
3
4
5
6
7
8
9
Hexadecimal Letters
A = 10
B = 11
C = 12
D = 13
E = 14
F = 15
Hexadecimal F is equal to the decimal number 15 (FF is 255). So, when Gary is increasing the
first column from 8B, to 9B, and then to BB he is increasing the
value of the RED column. In HTML the color white is #FFFFFF while black is #000000 (see the full hexadecimal color chart).
#8BB4AE
#9BC4BE
#BBE4DE
#CBF4EE
In order to lighten the last color that Gary used ( BBE4DE ) we are increasing each color column. The result is #CBF4EE. We're calculating what the color #CBF4EE will look like. Let's see if this works.
Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a rest home a few months ago and the old farm house was abandoned. The developers are cleaning out generations of "trash". We found some fabric and a hand-made doll that was in the room where Andy's mother used to live.
OK. I can hang with that color. Thanks Gary. I'm not color intuitive so the math example works well for me. For everyone else, here's a color chart that uses color names.
CSS BOXES and BORDERED IMAGES
Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a rest home a few months ago and the old farm house was abandoned. The developers are cleaning out generations of "trash". We found some fabric and a hand-made doll that was in the room where Andy's mother used to live.
Sampling Colors
We used Adobe to sample colors in the fabric.
Only you can hear the sound of one hand clapping. This is just spacer text. Some white space.
Centered Bordered Box
Background Color #C0D4AF
This is a centered bordered box. The background color is hexadecimal color C0D4AF. The box has a defined width of 300 pixels. The padding of 5 pixels is added so that the text doesn't flush up to the border. The border color is black.
The CSS Style code for a simple centered bordered box is made with a DIV. Copy and paste this in your Blog or Web page.
It will look like this.
This is a centered bordered box. The background color is hexadecimal color C0D4AF. The box has a defined width of 300 pixels. The padding of 5 pixels is added so that the text doesn't flush up to the border. The border color is black.
Only you can hear the sound of one hand clapping. This is just spacer text. Some white space.
Centered Bordered Box with Bordered Image
Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a rest home a few months ago and the old farm house was abandoned. The developers are cleaning out generations of "trash". We found some fabric and a hand-made doll that was in the room where Andy's mother used to live.
The CSS Style code for a centered bordered box with an image inside is made with a DIV and a nested SPAN for bordering and floating the image to the left of the text. Copy and paste this in your Blog or Web page.
It will look like this (image included).
Andy's Barn
We went back to Andy's barn and found this fabric. Andy went to a rest home a few months ago and the old farm house was abandoned. The developers are cleaning out generations of "trash". We found some fabric and a hand-made doll that was in the room where Andy's mother used to live.
You can replace our fabric image, change the border colors and the background colors. We had a hard time deciding on the right background color for the fabric. The walls where the fabric curtains were hanging were wood.

End of CSS Boxes and Bordered Images
CSS Grab Bag



Change Background Color
Change the background color to yellow for a portion of the text.Copy and paste this in your Blog or Web page.
It will look like this.
Change the background color to yellow for a portion of the text.Note: Code corrected Thursday. There was a stray <. Thank you Daisy for spotting this one.

Make the Background an Image
Copy and paste this in your Blog or Web page.
It will look like this.

Border Around Text
Copy and paste this in your Blog or Web page.
It will look like this.

Make Text Brown
Make the text BrownCopy and paste this in your Blog or Web page.
It will look like this.
Make the text Brown
Type in Italic Bold Font
Type in italic bold fontCopy and paste this in your Blog or Web page.
It will look like this.
Type in italic bold font
Make Font Size Bigger
Make the font size biggerCopy and paste this in your Blog or Web page.
It will look like this.
Make the font size bigger
Change the Font Family
Change the font familyCopy and paste this in your Blog or Web page.
It will look like this.
Change the font family
Type in Italic Font
Type in italic fontCopy and paste this in your Blog or Web page.
It will look like this.
Type in italic font
Change Text to Small Caps
Type in small capsCopy and paste this in your Blog or Web page.
It will look like this.
Type in small caps
Make Text Bold
Make the text boldCopy and paste this in your Blog or Web page.
It will look like this.
Make the text bold
Overline on a Link or Plain Text
put an overline on a link or plain textCopy and paste this in your Blog or Web page.
It will look like this.
put an overline on a linkChange the Letter Spacing
Change the letter spacingCopy and paste this in your Blog or Web page.
It will look like this.
Change the letter spacingMore Style? See W3.ORG STYLES



End of CSS Grab Bag
Referrer Script


If you haven't changed your Stephen Downe's referrer script code then you don't need to do so. The code will still work. Stephen set it up so that it automatically executes the version of his script running at TrueFresco.
The Stephen Downes's Referrer Script is done. Over and out. Thank you Stephen for letting all of us use your script and your server. Also, thank you for answering our questions.
Is there a Replacement?
BlogTricks has a Track Your Referrers with Link Feedback service. The BlogTricks version is "quick, easy and free" .
- Daisy is taking BlogTricks for a test drive.
- Punkclown is using the BlogTricks script. Look on the left column at his site.
- Joel is using BlogTricks but it doesn't appear to be refreshing right now (script is at the bottom of the page).
- We signed up for the BlogTricks script and the TrueFresco version and put them both on the Mandarin Design: Styling the Stephen Downes's Referrer Script page.
Script Monitoring
If we notice any problems with page load time or if any customizations outside of the script are needed we will put them on the Mandarin Design: Styling the Referrer Script page. The Blogtricks script appears to be fully customizable and took only a few minutes to install. There is a $10 fee to remove advertisments.
Truefresco.org works like the Stephen Downes's Referrer Script (because it is the old Stephen Downes's Referrer Script). Just copy and paste one line of code. The one line of code looks like this:
letrascomgarfos.net appears to be letting folks run a script adapted from Stephen Downes.
Still, if you find another referrer-type script let us know. If we all use the same script we will put a heavy load on the server. Actually, TrueFresco appears to be down right now. It may already be overloaded.
Cheap Tricks
~ Ken Camp IpAdventures
It's Sunday night and I'm dreading tomorrow. The application I'm working on is too secure even for an Intranet. It conveniently displays the configuration for our entire network that consists of well over 100,000 end-user devices. That's about all I can say without getting shot or having to shoot you.
So you want my job, eh?,
The last application I developed for the Internet was penetrated by our high-paid security staff and consultants. They pounded their chests, made copies of the password files distributing them throughout the department, and reported to the director that they had found a flaw.
How did they get in?
How did they gain access? Only two people had maximum authority on this sensitive system, me and one person in our Internet group. That person gave the security consultants the max authority userid and password. That gave them the name of a program that could be executed via the Internet if you had a valid max authority userid and password and had studied the system and learned the name of a particular program. Sitting at the server where the application ran they were able to penetrate.
Big whoop
Big whoop. Their job is to find holes and the hole here was a person, not the application. But, they were able to justify their existence by finding this security "problem".
So you want my job, eh?,
The impossible project that I"m working on right now will be completed in the next month or two. It will be released with a recommendation that it not be implemented due to security concerns. That's about all I can do at this point. We are literally surrounded by security staff. Only recently did I learn just how many people make up that group. No wonder they had to find an Internet application where they had to cheat to declare some success. There's no way I can protect the current application from them. They can look over the cubicle wall to watch me get in and then duplicate it. They can run software that I'm not detecting to pick up my keystrokes.
~ Ken Camp IpAdventures
Security? I give up.
Steal this image! The image is from Tack-O-Rama where images are 100% free. We added a touch of color and made the image transparent so that we can apply the glow filter or shadow filter next time we use it.
FORMULAS 1GRAND PRIX
du Canada 2005
The Red Car is Orange
The Red Car is orange. The red car we see on TV or in this photo is orange when you see it live. Very orange. Why? It's a camera cheat. The TV will pick it up as a vibrant red. The same is true on the Web. Colors vary on each computer screen and orange is one of those colors that may look nearly gold on one display and red on another. It depends on which orange you are trying to render.
CSS Text OverlayThe CSS Text Overlay on the image or on text can be a powerful technique. The Two-Color Headline uses the SPAN. The copy-and-paste code is here.
The Red Car is Orange
Three degrees of Blog
Michael O'Conner Clarke links to Joe Blog, his father's blog. He also links to Charlie's Den, a home for some of Michael's oldest son's first stories and drawings.
More family Blogs
Rieke's Blog from Indonesia is here and her son Dipta has a cool kid blog that we link to here. Rieke blogs in English while Dipta blogs in Bahasa.
"The most important thing a father can do for his children is to love their mother."
- from Rieke's writings
Andrea James (artist and geek) links to Lunchmoney, a blog by her father Steven James. On the eleventh day, of the eleventh month, Stephen James offered us the memory of a fallen soldier: Cleveland Jackson.
LA's son blogs at Threeks. He visits us now and then.
Otto blogs here while her mother Sherle blogs here.
The Sessums. Wow. We nearly forgot the Sessum family. We found George first (most find Jeneane first) and then Jeneane and sweet Jenna.
Susan's sister blogs at dobber.
There's more. Elaine of Kalilily and her son The One True b!X
More?Easy CSS Pullquotes
I was reading Newsweek yesterday, an article about The Apprentice and the now infamous words "You're Fired!". There's not much to read in Orthopedics so I carried the magazine to x-ray, Ortho1, Ortho2, and then took it home. I'll take a stack of magazines in to replace that one on the next visit.
TRUMP ON HIS MOMENT
"
This is the high point of my career. But I never viewed myself as having much of a low point
"
The March 2004 issue has the finest pullquotes I've seen. The pullquotes pulled the reader in, pulled me in. Pullquotes highlight the best or most seductive part of the article and make us want to read it. We can't match the style the print magazine used without graphics but we can come close using CSS Styled text.
I'm starting the style using the background color gold but the color that looks more gold, or a classier gold is #CCCD94. It may not look gold in every browser but it's a good neutral color.
Define the Pullquote: CSS Style
1. Add this to your external style sheet or add it to the HEAD section of your page (in your template).
.pullquote
{width: 145px;
background:gold;
color:black;
float: right;
border:1px solid maroon;
font-weight:bold;
line-height:140%;
padding:5px;
margin-left:5px}
2. Use the pullquote you defined in your Blog or Web page like this.
<p class="pullquote"> This is your pullquote. </p>
3. Copy and paste this in your Blog or Web page.
It will look like this.
Your post that contains way too much undecorated text goes here. The exact placement of the pullquote is up to you
TRUMP ON HIS MOMENT
"
This is the high point of my career. But I never viewed myself as having much of a low point
"
You need a lot of text before and after the pullquote. Try our example for testing. It works here. Our style sheet looks like this style1.css.
The Apprentice has a poll that asks "What is your favorite Apprentice moment so far?". Our answer was the most popular.
CSS Tip: Styling Lists With CSS
We like the way Larisa colors the code (not the use of the font tag in displaying the CSS code, but the way it displays).
<style type="text/css">
.colorList
{
border-style:solid;
border-width:2px;
border-color:maroon;
background-color:yellow;
color:navy;
font-weight:bold;
}
</style>
|
This one is for Joel, it took me a few days to finish it (wink).
BY GARY WILLIAMS AND MICHELLE GOODRICH(March 2004)
You don't want to miss this tutorial Stolen Shadows. Gary ripped it from us, we stole it back from him, and together our take on how to shadow your images just might make sense.
100 Most Often Mispronounced
Words and Phrases in English
Weather Forecast for Today: 84�
Symbols ° and ©
Susan makes the degree symbol � using ALT + 0176.
Gary types in ° to make °.
ALT + 0176
To make the � degree the way that Susan does, hold down the ALT key on your keyboard while pressing the number 0176 on the number pad.
©
To make the copyright © symbol we type in ©.
Full character sets are listed at W3.ORG. Let us know if you find a keeper.
What named colors work in all browsers?
Named Colors |
||
| aliceblue #F0F8FF |
aqua #00FFFF |
aquamarine #7FFFD4 |
| azure #F0FFFF |
beige #F5F5DC |
bisque #FFE4C4 |
| black #000000 |
blue #0000FF |
blueviolet #8A2BE2 |
| brown #A52A2A |
burlywood #DEB887 |
cadetblue #5F9EA0 |
| chartreuse #7FFF00 |
chocolate #D2691E |
coral #FF7F50 |
| cornsilk #FFF8DC |
crimson #DC143C |
cyan #00FFFF |
| darkblue #00008B |
darkcyan #008B8B |
darkgray #A9A9A9 |
| darkgreen #006400 |
darkkhaki #BDB76B |
darkmagenta #8B008B |
| darkorange #FF8C00 |
darkorchid #9932CC |
darkred #8B0000 |
| darksalmon #E9967A |
dimgray #696969 |
dodgerblue #1E90FF |
| firebrick #B22222 |
floralwhite #FFFAF0 |
forestgreen #228B22 |
| fuchsia #FF00FF |
gainsboro #DCDCDC |
ghostwhite #F8F8FF |
| gold #FFD700 |
goldenrod #DAA520 |
gray #808080 |
| green #008000 |
greenyellow #ADFF2F |
honeydew #F0FFF0 |
| hotpink #FF69B4 |
indianred #CD5C5C |
indigo #4B0082 |
| ivory #FFFFF0 |
khaki #F0E68C |
lavender #E6E6FA |
| lavenderblush #FFF0F5 |
lawngreen #7CFC00 |
lemonchiffon #FFFACD |
| lightblue #ADD8E6 |
lightcoral #F08080 |
lightcyan #E0FFFF |
| deepskyblue #00BFFF |
lightgreen #90EE90 |
lightgrey #D3D3D3 |
| lightpink #FFB6C1 |
lightsalmon #FFA07A |
lime #00FF00 |
| limegreen #32CD32 |
linen #FAF0E6 |
magenta #FF00FF |
| maroon #800000 |
mintcream #F5FFFA |
mistyrose #FFE4E1 |
| moccasin #FFE4B5 |
navajowhite #FFDEAD |
navy #000080 |
| oldlace #FDF5E6 |
olive #808000 |
olivedrab #6B8E23 |
| orange #FFA500 |
orangered #FF4500 |
orchid #DA70D6 |
| midnightblue #191970 |
palegreen #98FB98 |
peru #CD853F |
| pink #FFC0CB |
plum #DDA0DD |
powderblue #B0E0E6 |
| purple #800080 |
red #FF0000 |
rosybrown #BC8F8F |
| royalblue #4169E1 |
saddlebrown #8B4513 |
salmon #FA8072 |
| sandybrown #F4A460 |
seagreen #2E8B57 |
seashell #FFF5EE |
| sienna #A0522D |
silver #C0C0C0 |
skyblue #87CEEB |
| slateblue #6A5ACD |
slategray #708090 |
snow #FFFAFA |
| springgreen #00FF7F |
steelblue #4682B4 |
tan #D2B48C |
| teal #008080 |
thistle #D8BFD8 |
tomato #FF6347 |
| turquoise #40E0D0 |
violet #EE82EE |
wheat #F5DEB3 |
| white #FFFFFF |
whitesmoke #F5F5F5 |
yellow #FFFF00 |
Mandarin Color Charting
We tested the named colors in a few browsers including IE, Mozilla, and Netscape. They all work fine. Now when we make a box we can use the color name.
Copy and paste (or type) this in your Blog or Web page.
It will look like this.
See the updated Mandarin Color Charts for more tested named colors, the browser-safe hexadecimal color codes, and the 16 named colors that are guaranteed to work in all browsers. The corresponding hex code is included for serious developers who work in shops that require using the hex code rather than the color name.
More box copy-and-paste code is here.

80 degrees in West Sacramento today (record-breaking highs)
We'll share the backyard with the birds. This guy landed in the feeder. A few days old just learning how to fly he's bigger than a baby Jay and smaller than an Eagle. I think.
Swimming to Norah Jones and planting more seeds. Moonflowers today. The instructions say
PLANT YOUR THOUGHTS IN THE GARDEN
and so we will. What if they grow?
Gary found the degree symbol for the 80° above. It's
°.
Thanks Gary. The forecast for tomorrow is 84°.
Blog d�moli par Mandarin
SPAN or DIV?
Inline Style: <SPAN>
SPAN can be used to change the style of one
word in a sentence or an entire paragraph. For blocks of data use the DIV tag.
Inline style works well when you don't use an external style sheet. Also, we don't want our style sheet to grow when we are making a colored box that we will never use again.
SPAN Dotted Box
YOUR TEXT GOES HERECopy and paste (or type) this in your Blog or Web page.
It will look like this.
SPAN or DIV?
Inline Style: <DIV>
DIV is used to change the style for blocks of data that can include multiple paragraphs, line breaks, images, and more.
DIV Dotted Box
Copy and paste (or type) this in your Blog or Web page.
It will look like this.
SPAN or DIV?
Use the DIV if you are going to use more than one line of text inside the box or if you are using paragraphs. The SPAN and the DIV look the same here but once you type your text or add an image the SPAN box will start overlapping.
Update: If in doubt, use the DIV.
A special thank you to DianneMaire. She knows the meaning of Blog d�moli par Mandarin



Strikethrough Strikethrough
The DoeNetwork is the "International Center for Unidentified & Missing Persons" covering the US, Canada, Australia and Europe .
"There is no time limit to solving a mystery"
Dana of StolenInnocence (turn your volume down) and DoeNetwork.org was wondering how to do that "cross out a word" thing on a blog.
Strikethrough Strikethrough
Copy and paste (or type) this in your Blog or Web page.
This is <s>crossed out</s> and this is not.
It will look like this.
This isIt's called a strikethrough.
<s> or <strike> or <del> ?
Daisy would probably like for us to add that <s> and <strike> are both deprecated. W3C recommends doing it in the style sheet. Daisy uses the <del> tag, the <ins> companion. Using the <del> tag a strikethrough lookslike this. And I'll bet there's one more way to skin this cat. Anyone?
Two Degrees of Blog
Anita Rowland who we link to through the Quija Board links to StevenBerlinJohnson, an interesting writer whose book is selling well. He probably never has to use the strikethrough.



Styling Blockquotes
Do you use the BLOCKQUOTE tag? It automatically indents and centers without coding extra padding and looks nice without styling. But we've been meaning to define our BLOCKQUOTE in the External Style Sheet.
1. Blockquote without CSS STYLE
The unstyled BLOCKQUOTE looks like this.
This is my blockquote and will always be styled like this. We just use the blockquote tag.
Well, it doesn't exactly look like that. It will be rendered in your default font and will automatically indent on the left and the right, centering the block but not the text within. Our BLOCKQUOTE already has a STYLE applied.
2. Blockquote with CSS STYLE
We can add the following to our style sheet.
blockquote
{
font-family: courier new, courier;
}
Now when we type a BLOCKQUOTE in our blog like this -
<blockquote> This is my blockquote and will always be styled like this. We just use the blockquote tag. </blockquote>
It will look like this.
This is my blockquote and will always be styled like this. We just use the blockquote tag.
3. Blockquote with More CSS STYLE
Or, we could add more precise style to our External Style Sheet.
blockquote
{
border: 1px dashed black;
background:gold;
font-size: 10px;
color:#666;
font-family:verdana, arial, sans-serif;
padding:8px;
}
Now when we type a BLOCKQUOTE in our Blog or Web page.
<blockquote> This is my blockquote and will always be styled like this. We just use the blockquote tag. </blockquote>
It will look like this.
This is my blockquote and will be styled like this. We just use the blockquote tag.
But, we were waiting to steal Gary Turner's blockquote. It's a nice brown colored font. Decisions, decisions.
Change the Look of Your Tag Board
Add CSS Style to Your HTML Form
You can change the look of a Tag Board by adding some STYLE, as in CSS style=.
Tag Boards come with copy-and-paste code that includes a form inside of a table. You can change the TABLE or the FORM, or both.
Add CSS Style to Your Form
Style Fonts and Colors
CSS style is not complicated. You just have to know where to add it.
Here is the code for the simple form above.
Notice that fonts and colors are defined using the style=.
The form code will look like this.
We use the Tag-Board flavored Tag Board just because it was free at the time. Do you know of another board like Tag Board? Free?
CSS Borders and Mattes
A Gold Matte Picture Border
with a 1px Black Border
CSS Gold Matte Around Pictures

For this image we want to provide contrast between the picture and the frame with a gold matte 3 pixels wide around the picture. The black border will frame the picture.
First we put a gold border around the image by adding style="border: 3px solid gold" to the IMG tag.

We add a div with a black border that looks like a picture frame. And just because we wanted to, we added another div to center the image on the page. We worked from the inside out.

Copy and paste this in your Blog or Web page.
It will look like this.

Our image is 300 pixels wide. We used a width of 306 for the black outside border.
There's more about CSS Boxes and Borders in the CSS Boxes and Borders page.
Change the size and color of the matte and the border to match your picture. String the code together on one line so that you don't get an extra space between the picture and the matte.
CSS Borders and Mattes
CSS 1px Black Border
With CSS you can put a border around just about anything including (but not limited to) paragraphs, divs, spans, links, and tables. We usually add a 1 pixel black border around images like this.
CSS White Matte Around Pictures

For this image we want a white matte 3 pixels wide around the picture, and then a black border that looks like a picture frame.
First we put a white border around the image by adding style="border: 3px solid white" to the IMG tag. We can't actually see the white border yet since our background is white.
We add a div with a black border that looks like a picture frame. And just because we wanted to we added another div to center the image on the page. We worked from the inside out.

Copy and paste this in your Blog or Web page.
It will look like this.

Our image is 300 pixels wide. We used a width of 306 for the black outside border.
There's more about CSS Boxes and Borders in the CSS Boxes and Borders page.
Change the size and color of the matte and the border to match your picture.
Two degrees of Blog
Frank Paynter who we link to in the Quija Board links to Strathlachlan who we like to visit during the F1 Racing season. We're looking at this page while watching the race. The race is on right now and my Schumacher (Michael) is doing well. Rob's Jenson Button is currently running third. I just asked Rob "where's Michael?". He had to say "he's winning". Oh, how we miss the races. Rob is not a Schumacher fan, to me he is the ballerina of Formula One. Maybe we can make Montreal this year. It was supposed to be Monte Carlo for the Monaco Grand Prix. We'll see.
Life in the IT Trenches with a Rogue Developer
It's Friday, my day off and I'm not checking the email. I missed a meeting yesterday and don't really want to know the outcome. It's the same old song about our Network data. How is the data used, who owns it, and what is the solution to the imaginary problem?
I'm working on a secure Web-based application that will allow our customers to view their router configurations via our Intranet. There are more than a thousand routers for about twenty customers and for each router I build an HTML page using funky .bat files to download the configuration for each router, Perl for some manipulating, FoxPro to remove secure data and to format the thousand plus individual HTML files, and ColdFusion for the final presentation of the data.
There are a couple of requirements that make this task difficult.
- No CGI (Perl) is allowed on the production server.
- No database software is currently running on the server.
- No local copy of ColdFusion software.
- ColdFusion is the only software allowed on the server.
- Development PC is not in place.
- Data sources are changing.
- Sensitivity of data requires high security.
- Security requires encryption of all data (in addition to the SSL certificate).
- Passwords may not be stored in a database.
- Shared routers can't be displayed.
And so I code ColdFusion in Notepad and resort to an old Visual Studio 6 version of FoxPro for lack of other tools and time. There's some SAS on the mainframe where the initial data is gathered but that is already in place. I'll run most of it in batch jobs on the Development PC and will FTP the .HTML files to the Internet server each night.
Once it is prototyped I'll show it to internal Network and Security staff and recommend that the application not be put in place due to security issues. They will agree and the application will never be used.
And at that point, some would wonder why I don't just tell them now that it is not feasible. Because they have to see it . It's the nature of the beast. They think it is what they want. Once we filter out what each individual determines to be too secure to display there will be nothing left. I will have created a monster that will die before ever living. Or so I hope.
And that's why I take the long road to work where the river runs fast and the fields of mustard are blooming. That's probably why I plant Nasturtium seeds every few weeks. They grow or they don't. It doesn't matter either way. But today there are Nasturtiums blooming in every color and the mustard grows wild.
Make an Instant Logo or Banner Online
Banner Creator
We made that image as a banner blank (or banner background). It's 300 x 50 pixels. You can make your banner a size that suits you, or use any photograph. The Banner Creator lets you select from about 30 backgrounds and offers a number of fonts and colors for putting YOUR WORDS ON A BANNER.
You enter the background URL and then add text. We have a few banner blanks that you can use at the Banner page if you don't have readily available images.
Copy the the full name of the image you want to use before you go to the Instant Online Banner Creator or use one they supply. It's not fancy but it works. You can try it using our banner blank. Here's the URL to copy before you go to the Instant Online Banner Creator.
This is the morning drive to work on South River Road from West Sacramento to Sacramento. It's March and the wild Mustard is in full bloom.
Google Blogger Blues
Does Blogger ever truncate your template? It just truncated our main template again so we notified Blogger of the problem but we couldn't find "truncating template" in the knowledge base. Do you report problems to Blogger?
There's a new Blogger interface still in the development phase. We took it for a test drive with Google and provided feedback during a thirty minute session where we shared screens. It has more images in the layout, which for us was bad news since we were driving with large fonts on. The first thing I noticed was "where's the template?". It dropped us directly into posts.
For those of us who use Blogger I think we like the simplicity of the interface. There are problems like truncating templates and screens that you have to refresh by changing the current blog to another blog to see the full screen. Little things we've learned to work around. Overall we're satisfied with Blogger. But, it would be nice to see some work on the current Blogger. Get it fixed and then do the new rollout.
But you really came here to
see how to type Google in Color?
You can type Google in color.
Copy and paste (or type) this in your Blog or Web page.
String the code all on one line. It will look like this.
You can type Google in color.
Or, were you searching for Goodle Good News?
No-Sword says "Well, today is the 3rd of the 3rd, and Chinese and Chinese-derived calendars don't generally let those matching-number days get away without some kind of formalities. So welcome to Hina Matsuri. "
Stephen Downes who kindly provides the free Stephen Downe's referral script that requires only one line of JavaScipt code in your page has modified the script to remove the bad guys. Click here to get the one line of code and here to customize it.
We saw the Top Ten in Google First Names image at Stephen's place. We'll steal the image later. Ouch, we're Top Ten in Google First Names for Mandarin and for Meg. Not sure that's how it should be.
