Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 02-13-2008, 08:58 AM   PM User | #1
Brooxy28
New Coder

 
Join Date: Feb 2008
Posts: 23
Thanks: 4
Thanked 0 Times in 0 Posts
Brooxy28 is an unknown quantity at this point
Simple Font Issue

Hey guys,

Just started a Web Development course here in South Australia.

My first assignment I'm breezing through.

Basically build the worst looking website possible.

Anyway, I'm having the simplest of simple problems. I'm following the instructions on both my assignment and Dreamweaver's auto code filler thing, and I need to get the page font to Verdana, without wrapping <font> tag's around the text. (ie using the <style> tags in the header).

here is my code (btw, have a good laugh at how crap looking it is, its how it has to be.)

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Nick Brooks - 13/02/2008 -->
<title>Joe's Fruit Shop - Home</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
body {background-color: #CCFFCC; font:Verdana, Arial, Helvetica, sans-serif; font-size:12px}
h1 {text-align: center; font-size: 48px; font:Verdana, Arial, Helvetica, sans-serif;}
table {width: 1000px;}
</style>
</head>

<body>
<table border="0">
<tr>
<td height="120" colspan="2"><div align="center"><img src="images/joes_header.jpg" align="middle" title="Joe's Fruit Shop" alt="Joe's Fruit Shop" width="482" height="42" /></div></td>
</tr>
<tr valign="top">
<td width="200" valign=”top”>
<div align="center">
  <p><img src="Images/berry01_red.gif" alt="Home" title="Home Berry" width="22" height="20" /></p>
  <p>Home</p>
  <p>&nbsp;</p>
  <p><img src="Images/berry01_red.gif" alt="Produce" title="Produce Berry" width="22" height="20" /></p>
  <p>Produce</p>
  <p>&nbsp;</p>
  <p><img src="Images/berry01_red.gif" alt="History" title="History Berry" width="22" height="20" /></p>
  <p>History</p>
</div></td>
<td width="800" valign=”top”>
  <p align="center"><h1>Joe's Fruit Shop</h1></p>
  <p><img src="Images/fruit01.jpg" alt="Fruit" width="111" height="78" hspace="0" vspace="0" align="right" /><strong>At Joe's we are dedicated to selling the freshest, finest fruit, vegetables and cut flowers. We will deliver anywhere in the metropolitan area for only $10 (including GST).</strong></p>
  <p><em>We've been in business for the past 20 years in one location and now we've moved into the 21st century by moving on to the World Wide Web, where we can provide services we never dreamed of when Joe first opened the store way back in the 1980s.</em></p>
  <hr>
  <p><em><img src="Images/fruit02.jpg" alt="Fruit" width="68" height="75" align="left" />Take a look at our special fruit and vegetable baskets. We've collected the freshest, most succulent fruit and vegetables and packaged them in quantities to suit many different sized families. Because we buy in bulk, you get the benefits in low prices and fresher produce. All fruit and vegetables are guaranteed to be be delivered to you less than a day after they go on sale in the produce markets.</em></p>
  <p><strong>We can provide the baskets in organic produce too!</strong></p>
  <p><em>Ideal for the busy family - takes out all the agonising decisions about menus for the family and how to please everyone! And we can even provide menus to go with the basket!</em></p>
  <hr>
  <div style=”style definition;”>
    <div align="center">| Copyright | Privacy | Webmaster |</div>
  </div> </td>
</tr>
</table>
</body>
</html>
I have highlighted the bits of coding in question.

It comes up fine in Dreamweaver, but reverts to Times New Roman in Firefox & IE.

Here is a screen from IE:

Brooxy28 is offline   Reply With Quote
Old 02-13-2008, 09:02 AM   PM User | #2
abduraooft
Supreme Master coder!

 
abduraooft's Avatar
 
Join Date: Mar 2007
Location: N/A
Posts: 14,680
Thanks: 158
Thanked 2,182 Times in 2,169 Posts
abduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really nice
Change font:Verdana, Arial, Helvetica, sans-serif; to
Code:
font-family:Verdana, Arial, Helvetica, sans-serif;
__________________
Quote:
The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)
abduraooft is offline   Reply With Quote
Old 02-13-2008, 09:03 AM   PM User | #3
Brooxy28
New Coder

 
Join Date: Feb 2008
Posts: 23
Thanks: 4
Thanked 0 Times in 0 Posts
Brooxy28 is an unknown quantity at this point
Quote:
Originally Posted by abduraooft View Post
Change font:Verdana, Arial, Helvetica, sans-serif; to
Code:
font-family:Verdana, Arial, Helvetica, sans-serif;


Knew it was something that simple.

Cheers, you are a champion.
Brooxy28 is offline   Reply With Quote
Old 02-13-2008, 09:09 AM   PM User | #4
abduraooft
Supreme Master coder!

 
abduraooft's Avatar
 
Join Date: Mar 2007
Location: N/A
Posts: 14,680
Thanks: 158
Thanked 2,182 Times in 2,169 Posts
abduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really nice
You can make use of CSS-Validator in future!
__________________
Quote:
The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)
abduraooft is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 09:16 PM.


Advertisement
Log in to turn off these ads.