|
| |
|
|
arllc
Posts: 7
Joined: 10/14/2005
Status: offline
 |
Font in style sheet not working properly - 10/14/2005 16:52:40
Was hoping someone can help me on this issue. I have a css linked to my home page and the font type and size does not show up when typing. I am using this code in the css page.
{
font-family: "Verdana", "Arial", "Helvetica", "sans-serif"; font-size: 9pt; color: "#3C3C3C"; line-height:18px
}
What shows is Times New Roman, 12pt. Then when I change the default font in page options the font type shows as Verdana but it shows at 12 pt, not 9.
Any ideas on how to get this to work properly?
Thanks for any feedback.
|
|
|
|
arllc
Posts: 7
Joined: 10/14/2005
Status: offline
|
RE: Font in style sheet not working properly - 10/14/2005 18:20:05
Thanks for the response. This is very frustrating. I uploaded the site files. I appreciate your help. The code is listed below.
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" language="JavaScript1.2" src="_pgtres/stmenu.js"></script>
</head>
<body topmargin="0" leftmargin="0">
<div align="center">
<table cellpadding="0" cellspacing="0" width="800" height="1264" bgcolor="#FFFFFF">
<!-- MSTableType="layout" --><tr>
<td valign="top" colspan="2"><a href="../AttainResponse/index.htm">
<img src="images/web_with_tag.gif" width="300" height="73" border="0" alt="AttainResponse Logo"></a></td>
<td align="center" height="73"> </td>
</tr>
<tr>
<td valign="top" colspan="3" height="275">
<!-- MSCellType="empty" -->
</td>
</tr>
<tr>
<td valign="top" colspan="3" height="44">
<img border="0" src="images/d_01.gif" width="37" height="44"><img border="0" src="images/d_02.gif" width="163" height="44"><img border="0" src="images/d_03.gif" width="191" height="44"><img border="0" src="images/d_04.gif" width="409" height="44"></td>
</tr>
<tr>
<td valign="top" height="25">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="4" -->
<tr>
<td height="100%" width="100%" valign="top">
<!-- MSCellFormattingType="content" -->
</td>
</tr>
</table>
</td>
<td valign="top" colspan="2" rowspan="7">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="3" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="10" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="432" valign="top">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="9" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="10" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top">
<img border="0" src="images/l1.gif" width="11" height="11"> </td>
</tr>
<tr>
<td width="100%" height="100%" valign="top">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" height="53">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="5" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="5" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" height="47">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="6" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="5" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" height="43">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="7" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="5" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" height="40">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="8" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="5" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" id="stTABLE" height="29">
<table cellpadding="0" cellspacing="0" border="0" width="180" height="29">
<!-- MSCellFormattingTableID="1" -->
<tr>
<td height="29" width="180">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="5" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" colspan="3" height="172">
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">
<!-- MSCellFormattingTableID="2" -->
<tr>
<td height="100%" width="100%">
<!-- MSCellFormattingType="content" -->
<table border="0" width="100%" height="100%" cellpadding="5" cellspacing="0">
<tr>
<td width="100%" height="100%" valign="top"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" colspan="3" height="30">
<!-- MSCellType="empty" -->
</td>
</tr>
<tr>
<td width="180"></td>
<td width="120"></td>
<td height="1" width="500"></td>
</tr>
</table></div>
</body>
</html>
CSS:
a:link
{
color: #346699;
}
a:visited
{
color: #8C8C8C;
}
a:active
{
color: #000000;
}
a:hover
{
text-decoration: none; color: #006A00;
}
UL LI
{
list-style-image: url(images/bullet1.gif);
list-style-type: disc; color: #000000;
}
UL LI LI
{
list-style-image: url(images/bullet2.gif);
list-style-type: circle; color: #000000;
}
UL LI LI LI
{
list-style-image: url(images/bullet3.gif);
list-style-type: square; color: #000000;
}
body
{
background-color: #73828C;
color: rgb(0, 0, 0);
}
font
{
font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9pt; color: #3C3C3C; line-height:18px
}
| |
|
|
|
womble
Posts: 5528
Joined: 3/14/2005
From: Living on the edge
Status: offline
|
RE: Font in style sheet not working properly - 10/14/2005 18:44:49
Well it took me a couple of minutes to figure out there's no text in that code (long day and I don't use table layouts any more so it took a while for the brain cells to kick in  ), but once I stuck some test text in there, figured out what the problem could be.
I think this bit of your css might be the problem:
quote:
font
{
font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9pt; color: #3C3C3C; line-height:18px
}
When I put some text in there, nothing happened, as you said, I got Times New Roman. It's your 'font' selector that's causing the problem, I think. I put some text in there with <p> tags, changed the 'font' in the css to 'p' (without the quotes), tried again, and...Verdana 9pt!
That should work. If you're using FP you can quickly edit the tags by selecting the <p> tag on the list of tags at the top of the page, then pick 'edit tag' from the drop-down list, or just make sure you've got a <p> tag (presuming it is paragraph text) around the text if you're doing it in code view.
i.e., in your code, for example:
<td width="100%" height="100%" valign="top"> <p>Test</p></td>
and in your css:
p
{
font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9pt; color: #3C3C3C; line-height:18px
}
Hope that helps!
_____________________________
~~ "A cruel god ain't no god at all" ~~
| |
|
|
|
arllc
Posts: 7
Joined: 10/14/2005
Status: offline
|
RE: Font in style sheet not working properly - 10/14/2005 18:54:33
Ah yes, you are brilliant. Thank you.
This is what I get for trying to get the CSS to work too soon, before some text.
Thanks again.
Also, you mentioned that you no longer use table layouts. Can I ask what you do use?
Thanks
| |
|
|
|
arllc
Posts: 7
Joined: 10/14/2005
Status: offline
|
RE: Font in style sheet not working properly - 10/14/2005 19:06:29
Yes, thanks for the advise. I do not build Web sites for a living so I think I will take your advise and keep my css use to the basics.
Thanks again. You really saved my sanity.
| |
|
|
|
c1sissy
Posts: 5084
Joined: 7/20/2002
From: NJ
Status: offline
|
RE: Font in style sheet not working properly - 10/15/2005 6:41:21
You anchor styles are also in the wrong order, always remember LVHA, Link, visited, hover, active.
You might run into future problems if you don't fix this as well.
Good luck.
_____________________________
Deb-aka-c4Ksissy
high panjandurum and alpha female of the silverback tribe
As decreed by Jesper 5-24-2003.
The only stupid question is... the one that is never asked!!
http://directory.css-styling.com
http://fmsforum.com
http://positioniseverything.net/
http://www.tanfa.co.uk/
| |
|
|
|
arllc
Posts: 7
Joined: 10/14/2005
Status: offline
|
RE: Font in style sheet not working properly - 10/16/2005 23:32:40
Great, thanks so much for the expert feedback.
Can I ask you another question about my bullets. When I use picture bullets in css the font comes out 12 pt. on the design page but 9pt. when I view it in IE or FireFox.
Also, the bullet itself is misaligned in IE but not in FireFox. In IE the text is dropped down about half a line so it looks funny.
Any ideas? Also, I really appreciate your help and would be more than happy to compensate you to help trouble shoot this. Just let me know what you would charge.
Thanks again.
| |
|
|
|
c1sissy
Posts: 5084
Joined: 7/20/2002
From: NJ
Status: offline
|
RE: Font in style sheet not working properly - 10/17/2005 0:05:17
In your styles in the
html, body
{font-size: 100.01%;}
This should help you get your fonts to be equal in other browsers. Then in the rest of the page, you do your style rules with the font size as you wish for them to be.
Also, for your web pages, you should be using relative sizes for your font sizing so that those who wish to resize their fonts may do so.
Using pixels, ems or percentages is usually the way to go, unless you are styling a page for printing then you to to the fixed sizing.
I start with the font sizing as I showed you above, and then I use ems for the rest of the page, increasing and decreasing as I wish to.
_____________________________
Deb-aka-c4Ksissy
high panjandurum and alpha female of the silverback tribe
As decreed by Jesper 5-24-2003.
The only stupid question is... the one that is never asked!!
http://directory.css-styling.com
http://fmsforum.com
http://positioniseverything.net/
http://www.tanfa.co.uk/
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
) 
You mean they didn't confiscate it as soon as you got to the OF door?! Usually we have to hand it in at the cloakroom and collect it again on the way out...
