Tables and fonts

I had a question from a flirt earlier today. She had followed the tutorial for putting buttons in tables, which shows you how to put buttons in tables with neat labels with each button, so your purchaser can see what they are.

The tutorial is intended to produce a table that looks something like this.

The problem was that her page had a black background. She had changed the text on her page to another color, using an html tag like this:

But the font in the table remained black, and did not show up because the background was also black. The labels were there, but nobody could read them.

Unfortunately, when you set the font color, size, and face for a page in html, it does not affect the color of anything within a table. You need to set that color inside each cell to get them to change.

So her table looked like this:

I’m going to set the font as “arial”, which is the Niteflirt default. You can, of course, choose any font you want, remembering that if you pick a weird one that your visitor may not have installed, something else will appear. I’m going to set the color to “white”. Not all color names will work on Niteflirt. If you like a named color but it doesn’t show up on Niteflirt, you should download a color picker to find the proper hex code for that color. Then I’m going to set the size to 3, which is one size larger than the standard Niteflirt squinty size of 2. And for good measure I’m going to make it bold, so it will be easier to read.

I will set the font properties within a single <font> tag, but the bold must be separate. Both must come before the text. So they can be the first thing inside the cell, or they can be just before the text you are trying to format. So you can see where the table cell ends, I’m going to put the ‘td’ and ‘/td’ tags. What I’ve put in bold and red will be your Niteflirt button code, if you are not substituting a button image of your own.

<td><a href="http://niteflirt_button_code"><img src="http://your_image_url"></a><br><font face="arial" color="white" size="3"><b>Button Label</td>

Normally in html you would also put end tags, but we’re trying to save space on Niteflirt, and when it doesn’t matter, we leave them out. You would need to end the font, size, or color if you wanted to change any of those.