background color

kaz · #1 (**permalink**) Aug 3rd, 2005, 17:34

Hi all,

The background color for one of the pages a newsletter that I'm designing is giving me problems. According to the style sheet for the newsletter, the top table which contains the logo and the titles of the newsletter should have a yellow background. Instead, when I pull it up on my browser, instead of the backgroung being yellow it's white. What could be the problem. The temporary link for the page is 80.88.147.58/news/wifi1.htm.

thanx

kaz

herkalees · #2 (**permalink**) Aug 3rd, 2005, 18:45

Your link doesn't work. Could you post the source code? If not, check to make sure the <table> code and the <body> code don't have anything which tells them to render the background white in the HTML.

kaz · #3 (**permalink**) Aug 4th, 2005, 09:45

Hi,

here is the source code:

<!DOCTYP<E 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">

<link href="templates/dir.css" rel="stylesheet" type="text/css">

<title>What is Wifi</title>
<tr>
<td width="700" class="ybgr"><div align="left">
<table width="700">
<tr>
<td width="100 class=" height="88" class="logo"ug">[img]graphix/Crest_02.jpg[/img]</td>
<td width="100" h class="ug">IT@UG</td>
<td width="700" align="right" class="bullet">ICT Directorate ebulletin</td>
</tr>
</table>
<table width="700" align="right">
<tr>
<td height="1058" valign="top" class="wbg"><table width="700">
<tr>
<td width="700" align="right" class="issue">Issue 1,
MAY 2005</td>
</tr>
</table>
<table width="700">
<tr>
<td valign="top" class="welcome">

How WIFI Works </p>

WiFi is the wireless way to handle networking. It is also known as 802.11 networking and wireless networking. The big advantage of WiFi is its simplicity. You can connect computers anywhere in your home or office without the need for wires. The computers connect to the network using radio signals, and computers can be up to 100 feet or so apart.

In this article, we will discuss two different aspects of WiFi. First we will discuss the basic technology that makes WiFi networking possible. Then we will discuss the hardware you need to create a WiFi network, and help you understand how to set up and access a WiFi hotspot in your home. </p>
The Walkie-Talkie Network</font>

If you want to understand wireless networking at its simplest level, think about a pair of $5 walkie-talkies that you might purchase at Wal-Mart. These are small radios that can transmit and receive radio signals. When you talk into a Walkie-Talkie, your voice is picked up by a microphone, encoded onto a radio frequency and transmitted with the antenna. Another walkie-talkie can receive the transmission with its antenna, decode your voice from the radio signal and drive a speaker.

Simple walkie-talkies like this transmit at a signal strength of about 0.25 watts, and they can transmit about 500 to 1,000 feet.

Let's imagine that you want to connect two computers together in a network using walkie-talkie technology:
<ul>[*]You would equip each computer with a walkie-talkie.[*]You would give each computer a way to set whether it wants to transmit or receive.[*]You would give the computer a way to turn its binary 1s and 0s into two different beeps that the walkie-talkie could transmit and receive and convert back and forth between beeps and 1s/0s.[/list]

This would actually work. The only problem would be that the data rate would be very slow. A $5 walkie-talkie is designed to handle the human voice (and it's a pretty scratchy rendition at that), so you would not be able to send very much data this way. Maybe 1,000 bits per second.
</p>

</p>

</p>
<div align="right"><p class="nextpage">Next Page </p>
</td>
</tr>
</table>
</head>
</html>
</body>

kaz

herkalees · #4 (**permalink**) Aug 4th, 2005, 15:35

After looking at your code, the background color is the least of your problems. You are missing so many important tags...

I spent a few minutes fixing your pasted code and now it's perfectly valid:

Code: Select all

<!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>
<title>What is Wifi</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="templates/dir.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table cellpadding="0" cellspacing="0">
  <tr>
    <td width="700" class="ybgr"><div align="left">
        <table width="700">
          <tr>
            <td width="100" height="88" class="logoug">[img]graphix/Crest_02.jpg[/img]</td>
            <td width="100" class="ug">IT@UG</td>
            <td width="700" align="right" class="bullet">ICT Directorate ebulletin</td>
          </tr>
        </table>
        <table width="700" cellpadding="0" cellspacing="0">
          <tr>
            <td height="1058" valign="top" class="wbg"><table width="700">
                <tr>
                  <td width="700" align="right" class="issue">Issue 1, MAY 2005</td>
                </tr>
              </table>
              <table width="700">
                <tr>
                  <td valign="top" class="welcome">

How WIFI Works </p>
                    

WiFi is the wireless way to handle networking. It is also known as 802.11 networking and wireless networking. The big advantage of WiFi is its simplicity. You can connect computers anywhere in your home or office without the need for wires. The computers connect to the network using radio signals, and computers can be up to 100 feet or so apart. In this article, we will discuss two different aspects of WiFi. First we will discuss the basic technology that makes WiFi networking possible. Then we will discuss the hardware you need to create a WiFi network, and help you understand how to set up and access a WiFi hotspot in your home. </p>
                    The Walkie-Talkie Network</font>

                    If you want to understand wireless networking at its simplest level, think about a pair of $5 walkie-talkies that you might purchase at Wal-Mart. These are small radios that can transmit and receive radio signals. When you talk into a Walkie-Talkie, your voice is picked up by a microphone, encoded onto a radio frequency and transmitted with the antenna. Another walkie-talkie can receive the transmission with its antenna, decode your voice from the radio signal and drive a speaker.
                    

 Simple walkie-talkies like this transmit at a signal strength of about 0.25 watts, and they can transmit about 500 to 1,000 feet.</p>
                    

 Let's imagine that you want to connect two computers together in a network using walkie-talkie technology:</p>
                    <ul>[*]You would equip each computer with a walkie-talkie.[*]You would give each computer a way to set whether it wants to transmit or receive.[*]You would give the computer a way to turn its binary 1s and 0s into two different beeps that the walkie-talkie could transmit and receive and convert back and forth between beeps and 1s/0s.[/list]                    

This would actually work. The only problem would be that the data rate would be very slow. A $5 walkie-talkie is designed to handle the human voice (and it's a pretty scratchy rendition at that), so you would not be able to send very much data this way. Maybe 1,000 bits per second. </p>
                    

</p>
                    

 </p>
                    <div align="right">
                      <p class="nextpage">Next Page </p>
                    </div></td>
                </tr>
              </table></td>
          </tr>
        </table>
      </div></td>
  </tr>
</table>
</body>
</html>

Now looking at it (fixed), it's plain to see there are no color declarations in this XHTML, so your issue was either all the bad code, which is now fixed, or there's a color issue inside your CSS file (templates/dir.css)

kaz · #5 (**permalink**) Aug 4th, 2005, 17:28

herkalees,

I viewed the changes on my browser and the changes are still the same.

here is the style sheet:

.navs1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: 500;
color: #FFFFFF;
background-color: #CC3300;
text-align: left;
margin: 0.5px;
width: 455px;
padding-top: 1.5px;
}
.ict {
font-family: Arial, Helvetica, sans-serif;
font-size: x-large;
font-style: normal;
font-weight: 500;
font-variant: normal;
background-color: #FFFFFF;
text-align: left;
text-transform: uppercase;
color: #000099;

}
.announce {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: 600;
background-color: #FFCC00;
text-align: left;
height: 70px;
width: 70px;
border: thin solid #000000;

}
.ann {
width: 136px;
margin-top: 0.5px;
padding-top: 1.5px;
}
.box {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: 500;
color: #000000;
background-color: #FFCC33;
text-align: left;
margin: 0.5px;
padding: 1.5px;
width: 300px;

}
.nav2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: 400;
color: #000000;
background-color: #FFCC33;
text-align: left;
margin: 0.5px;
padding: 1.5px;
height: 70px;
width: 70px;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-left-style: solid;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;
border-right-style: solid;
border-top-style: solid;
border-bottom-style: solid;

}
.main {
padding: 1.5px;
height: 900px;
width: 900px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 200;
background-color: #FFFFFF;
text-align: left;
border: thin solid #FF0000;

}
.paa {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-align: left;
}
.newsletter {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
font-variant: normal;
color: #000000;
}
.today {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: normal;
text-align: center;
}
.features {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: 500;
text-align: left;
}
.main2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 400;
font-variant: normal;
color: #000000;
background-color: #FFFFFF;
text-align: left;
height: 700px;
width: 700px;
}
.itug {
font-family: "Times New Roman", Times, serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
font-variant: normal;
color: #000000;
background-color: #FFFF99;
text-align: center;
width: 500px;
}
.ybgr {
background-color: #FFFF33;
height: 500px;
width: 500px;
font-family: "Times New Roman", Times, serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
color: #000000;

#itug(text-align: center

}
.ug {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
font-weight: 500;
color: #000000;
text-align: center;
width: 400px;
background-color: #FFFF33;
}
.bullet {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 600;
color: #000000;
text-align: center;
width: 400px;
background-color: #FFFF33;
}
.issue {
font-family: "Times New Roman", Times, serif;
font-size: 16px;
font-style: normal;
font-weight: 500;
color: #FF6600;
background-color: #FFFFFF;
text-align: right;
width: 500px;

}
.white {
}
.logo {
width: 400px;
background-color: #FFFF66;
}
.welcome {
background-color: #FFFFFF;
text-align: left;
width: 700px;

}
.wbg {
background-color: #FFFF66;
height: 500px;
width: 500px;
}
.uh {
text-align: left;
width: 700px;
background-color: #FFFFFF;
}
.tip {

}
.advent {
width: 700px;
background-color: #FFFFFF;
}
.copyright {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: bold;
font-variant: normal;
text-decoration: none;
text-align: center;
}
.unnamed1 {
}
a:link {
text-decoration: none;
}
a:visited {
background-color: #663399;
}
a:hover {
background-color: #FFFFFF;
}
a:active {
background-color: #FFFFCC;
}
.wifi {
background-color: #FFFFFF;
}
.nextpage {
text-align: right;
}

Also, try this link and see whether it would work.

http://80.88.158.47/news/wifi1.htm

thanx

kaz

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
background color in xml	kool77	Other Programming Languages	2	Jul 7th, 2007 15:30
background-color	kapyrossi	Web Page Design	5	Jul 4th, 2007 15:53
IFRAME - background color	jansoft	Web Page Design	0	May 18th, 2007 11:21
chnaging the background color	DavidinLondon	Web Page Design	0	May 20th, 2006 19:37
background color	kaz	Web Page Design	1	Apr 20th, 2005 11:43

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
background color