body font size problem

samv · #1 (**permalink**) Feb 19th, 2007, 16:06

Hi all

I am just putting together a simple CSS for my site (which is table based). At this stage i would like the text to be arial, blue and 12px (or approx 0.8em). i have put the following into my style sheet:

body { font-family: Arial, Helvetica, sans-serif; font-size= 12px; color: #006699; }

.bold {font-weight=bold; }

and then linked it to the homepage. But i can't seem to get the font size to change. I can change the colour though so it must all be connecting ok. Am i doing anything glaringly obvious wrong?

the code for the page is below

Any ideas would be great

Thanks
Sam

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>
    <title>dressed to a tee - the new home of golf</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="description" content="We are the sponsors of 'The Swing Easy Golf Tour.' We report all the action as it happens and offer the full range of offical tour merchandise">
    <meta name="keywords" content="golf clothes clothing attire shirt shirts tee tees organic cotton sports fashion lifestyle keep smiling swing easy">
    <link rel="stylesheet" href="dtat.css" type="text/css">
</head>

<body>

<!--********** BANNER IMAGE MAP ***************-->

    <map name="banner" id="banner">
    <area alt="logo" shape="poly" coords="11,17,132,5,143,119,22,129" href="index.html" />
    <area alt="clothing" shape="poly" coords="246,116,337,110,339,127,249,132" href="clothing.html" />
    <area alt="accessories" shape="poly" coords="361,118,473,109,475,122,362,132" href="accessories.html" />
    <area alt="swing easy tour" shape="poly" coords="497,122,645,109,648,123,499,135" href="swing_easy_tour.html" />
    <area alt="news" shape="poly" coords="669,116,714,112,716,125,671,129" href="news.html" />
    <area alt="info" shape="poly" coords="738,116,775,112,777,112,777,125,740,128" href="info.html" />
    <area alt="bag" shape="poly" coords="800,119,831,114,835,128,801,133" href="bag.html" />
    </map>

<!--********** /BANNER IMAGE MAP ***************-->

    <table width="870" border="0" align="center" cellpadding="0" cellspacing="10">

<!--********** BANNER ***************-->

        <tr>
            <td colspan="3"><img src="images/banner.gif" alt="banner" usemap="#banner" width="870" height="139" border="0" /></td>
        </tr>

<!--********** /BANNER ***************-->

<!--********** MAIN CONTENT ***************-->
    
        <tr>
            <td colspan="2" rowspan="2" valign="top"> <img src="images/mainpic.jpg" alt="mainpic" width="550" height="265" /></td>
            <td width="310" valign="top">
                <img src="images/headings/welcome.gif" alt="welcome" width="134" height="44" />    
                <br/ >The van is old and the itinerary sketchy but we’re ready to roll - The Swing Easy Tour is coming to a fairway near you…!
                <br/ ><br/ >You can follow all the exclusive action here at dressedtoatee.co.uk. And for all the gossip inside the ropes, sign up to Spike’s Tour Diary.
                <br/ ><br/ >Take a look around and get to know the characters and their wardrobes. The official tour clothing & accessories are a must have for any swing easy fan.
            </td>
        </tr>
        <tr>

            <td rowspan="2" valign="top">
                <img src="images/headings/news.gif" alt="welcome" width="83" height="44" />
                <br/ ><span class="bold">Colonel wins again</span> 
                <br/ >17th January 2007, 10.05am, posted by Spike
                <br/ >The legend continues to plunder the ‘Swing Easy Tour’ with a massive victory at Royal Cromer, Norfolk…click for more
                <br/ ><span class="bold">Lord’s Prayer not answered</span>
                <br/ >23rd January 2007, 10.05am, posted by Spike
                <br/ >Not for the first time Vicar Chipper and Lord Slider met at Coventry (don’t be put off by the location) Finham…click for more
            </td>
        </tr>
        <tr>
            <td width="270" height="165" valign="top"><img src="images/swingeasytour.gif" alt="swing easy tour" width="270" height="165" /></td>
            <td width="270" valign="top"><img src="images/officialtourclothing.gif" alt="clothing" width="270" height="165" /></td>
        </tr>

<!--********** /MAIN CONTENT ***************-->


<!--********** BOTTOM BANNER ***************-->

        <tr>
            <td colspan="3"><img src="images/bottombanner.gif" alt="bottom banner" width="870" height="26" /></td>
        </tr>

<!--********** /BOTTOM BANNER ***************-->

    </table>

<!--********** GOOGLE ANALYTICS CODE ***************-->

<!--********** /GOOGLE ANALYTICS CODE ***************-->

</body>

</html>

samv · #2 (**permalink**) Feb 19th, 2007, 18:16

Noticed the = , and amended it to : but still cant change the text size!

and the font weight amended too now.

body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #006699; }

.bold {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #006699; }

karinne · #3 (**permalink**) Feb 20th, 2007, 16:25

What do you mean by "I can't change the font size" ... In your CSS or through the browser?

IE doesn't do well with px units ... it doesn't resize them (but all the other browsers do

)

samv · #4 (**permalink**) Feb 20th, 2007, 16:53

Hi karinne

I mean if i changed the font colour in the body parenthesis in my css, it changes the font colour accordingly in the body of my web pages.

But if i try and change my font size in my css, it does change in IE but not in mozilla.

I have got round it by using a td {fontsize: 12px} which I can change accordingly, which is ok but not my ideal solution.

Any thoughts on why it wont change in the body parenthesis?

Sam

Lchad · #5 (**permalink**) Feb 20th, 2007, 20:21

Am I wrong or does the order matter???
should it be
body {12px Arial, Helvetica, san-serif;
color: #006699;
}

Ryan Fait · #6 (**permalink**) Feb 20th, 2007, 22:41

font is shorthand Lchad. Check this out for an explanation of it

http://ryanfait.com/articles/2006/10...css-shorthand/

Can we have a link?

masonbarge · #7 (**permalink**) Feb 21st, 2007, 11:55

Quote:

Originally Posted by samv

Hi karinne

I mean if i changed the font colour in the body parenthesis in my css, it changes the font colour accordingly in the body of my web pages.
But if i try and change my font size in my css, it does change in IE but not in mozilla.

I have got round it by using a td {fontsize: 12px} which I can change accordingly, which is ok but not my ideal solution. Any thoughts on why it wont change in the body parenthesis?

Sam

What you did is exactly correct. My best guess is that it is a combination of inheritance rules and browser default overrides. I imagine 99% of the world does exactly what you do -- when a td font size isn't affected by a parent or ancestor, just add the element to the style sheet.

Once the element is styled, you don't need to put the complete font information in ".bold". You had it right the first time -- .bold {font-weight: bold;} is all you need.

Using "px" as the font size is not the best way, because the two primary browsers treat it differently: FF will resize it but IE will not. "pt" is better if you don't want the user to resize it, and "em" or "%" if you do want them to resize it. Also, you should specify line-height if you specify font-size, for predictable results.

I would do separate font-family, font-size, etc., if I were using a single stylesheet. Early IE versions (through 6.0) sometimes do strange things with the "font:" declaration.

LinkBacks (?) LinkBack to this Thread: http://www.webforumz.com/web-page-design/21777-body-font-size-problem.htm
Posted By	For	Type	Date
Article Feed » body font size problem	This thread	Pingback	Feb 19th, 2007 20:21

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Using Font Size in BODY attribute	nne	Website Planning	7	Sep 11th, 2007 11:35
side link tabs font size problem	paul1234	Starting Out	2	Jan 11th, 2007 19:55
Best way to define font size?	rubyfruit	Web Page Design	11	Sep 13th, 2006 13:58
why h1 doesn't inherit font -size from body?	sahota	Web Page Design	3	Dec 12th, 2005 20:55
font-size: does not work in <body>	andersonoo7	Web Page Design	4	Jul 23rd, 2005 03:00

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
body font size problem