weikelbob
asked on
column background
I have 3 columns from CSS and I'm wonering how to make one of the column's background a different color.
Thank you,
Bob
Thank you,
Bob
Example with table:
<HTML>
<HEAD>
<TITLE></TITLE>
<style>
.column_1
{
background-color: red;
}
.column_2
{
background-color: pink;
}
.column_3
{
background-color: yellow;
}
</style>
</HEAD>
<BODY>
<table cellspacing="0" width="200px">
<tr>
<td class="column_1">1</td>
<td class="column_2">2</td>
<td class="column_3">3</td>
</tr>
<tr>
<td class="column_1">1</td>
<td class="column_2">2</td>
<td class="column_3">3</td>
</tr>
<tr>
<td class="column_1">1</td>
<td class="column_2">2</td>
<td class="column_3">3</td>
</tr>
</table>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE></TITLE>
<style>
.column_1
{
background-color: red;
}
.column_2
{
background-color: pink;
}
.column_3
{
background-color: yellow;
}
</style>
</HEAD>
<BODY>
<table cellspacing="0" width="200px">
<tr>
<td class="column_1">1</td>
<td class="column_2">2</td>
<td class="column_3">3</td>
</tr>
<tr>
<td class="column_1">1</td>
<td class="column_2">2</td>
<td class="column_3">3</td>
</tr>
<tr>
<td class="column_1">1</td>
<td class="column_2">2</td>
<td class="column_3">3</td>
</tr>
</table>
</BODY>
</HTML>
I guess the most usefull way of doing this is to use the <colgroup> and the <col> elements where you can specify properties voor table-columns. (example below)
You should note the 'cellspacing="0"' clause, because a cellspacing >0 breaks the coloring of the column, because the style you define in the <col> element only works on the below td/th elements and not on the spacing between those cells.
-r-
example:
<table cellspacing="0" border="0">
<colgroup>
<col style="background-color:re d;">
<col style="background-color:wh ite;">
<col style="background-color:bl ue;">
</colgroup>
<tr>
<td>cell 1,1</td>
<td>cell 1,2</td>
<td>cell 1,3</td>
</tr>
<tr>
<td>cell 2,1</td>
<td>cell 2,2</td>
<td>cell 2,3</td>
</tr>
</table>
You should note the 'cellspacing="0"' clause, because a cellspacing >0 breaks the coloring of the column, because the style you define in the <col> element only works on the below td/th elements and not on the spacing between those cells.
-r-
example:
<table cellspacing="0" border="0">
<colgroup>
<col style="background-color:re
<col style="background-color:wh
<col style="background-color:bl
</colgroup>
<tr>
<td>cell 1,1</td>
<td>cell 1,2</td>
<td>cell 1,3</td>
</tr>
<tr>
<td>cell 2,1</td>
<td>cell 2,2</td>
<td>cell 2,3</td>
</tr>
</table>
ASKER
Thank you guys for all of the information so far.
ASKER
OK, I probably don't want to use a table, I would like to do this only with CSS if possible.
Sajuks gave me a setup using all CSS. I am new and I could not figure this out. I'm offering my code, and I hoping you guys can step me through this.
my code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Langua ge" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
body
{
margin:0;
padding:0;
font:13px arial, verdana, sans-serif;
}
#container
{
min-width: 700px;
max-width: 1200px;
width: expression((this.parentNod e.clientWi dth > 1200)?1200+"px":(this.pare ntNode.cli entWidth <= 700 + 0)?700+"px":"auto")
}
#header
{
background:#ffffff url('background-picture.gi f');
text-align:center;
/* no width needed */
height:188px
}
#header img
{
margin:0 auto;
display:block;
}
#leftcol
{
float:left;
width:33%;
}
#centercol
{
float:left;
width:33%;
text-align:center;
}
#rightcol
{
float:left;
width:33%;
}
.spacer
{
padding:10px 20px;
}
#leftcol p, #rightcol p
{
text-align:justify;
}
#footer
{
background:#ffffff url('widening-footer.gif') ;
text-align:center;
/* no width needed */
height:22px
}
#footer img2
{
margin:0 auto;
display:block;
}
img
{
border:none;
}
img2
{
border;none;
}
a:link, a:visited, a:hover, a:active
{
text-decoration:none;
</style>
</head>
<body>
<div id="container">
<div id="header" style="width: 100%; height: 190px">
<map name="FPMap0">
<area href="index.html" shape="rect" coords="430, 172, 487, 189">
<area href="more.html" shape="rect" coords="502, 174, 639, 189">
<area href="contact.html" shape="rect" coords="653, 174, 733, 189">
</map>
<img border="0" src="../helen/header.jpg" width="750" height="190" usemap="#FPMap0"></div>
<div id="leftcol" style="width: 33%; height: 283px">
<div class="spacer">
<p align="justify"><b><i>Here is more about Helen:</i></b></p>
<p align="justify">She has had periodicals printed
in five languages, by the 'Christian Science Publishing society'.<br>
<br>
She has been published in five large news papers and several small ones,
Idaho Farm Journal, and TV Guide.<br>
<br>
She has designed <a href="http://www.b-transfers.com/oreana">God and Country
stickers</a> for cars, doors, mailboxes, etc. and several Biblical games,
the games yet to be published.<br>
<br>
</p>
<p> </div>
</div>
<div id="centercol" style="width: 33%; height: 195px">
<div class="spacer">
<p style="text-align: justify">She has had two songs published and
recorded by her daughter, Betty Nanney Hillman. <br>
<br>
Her hobby and third love is swimming, writing, painting. Her second
love her children and grandchildren, including grates. She loves
special times with the grandchildren. Her first Love is God and His
Christ, "Jesus'.<br>
<br>
Her favorite movies are, "Ten Commandments", with Charlatan Heston,
Gone With the Wind," and "Passion of the Christ."<br>
<br>
Her favorite News castors are: O'Reilly, Greta, Shepherd Smith,
Sean, Heraldo, Beltway boys, Neil, most of Fox news casters. They
tell the Truth, and I like game shows that ask questions.<br>
<br>
</div>
</div>
<div id="rightcol" style="width: 33%; height: 245px">
<div class="spacer">
<div>
<p style="margin-top: -1px; margin-bottom: -1px"> </p>
<p style="margin-top: -1px; margin-bottom: -1px">Her favorite TV show is
700 Club, Shepherds Chapel, Bennie Hinn, Joyce Myers, Public Television,
Discovery Channel, Wild Kingdom, and all those type shows, plus
Diagnosis Murder, Murder She Wrote, Whose Line Is it. Most TV is a
waste. I like clean comedy shows.</p>
<p style="margin-top: -1px; margin-bottom: -1px"><br>
Goldie Haun and Charleston Heston are Helen's favorite actors. She has
spent over half of her life on the farm, and in land development.<br>
<br>
She loves all sports. </div>
<div>
</div>
<p>
<img border="0" src="../helen/pallet-trans parent.gif " width="152" height="97"></div>
</div>
<div id="footer" style="width: 100%; height: 22px">
<img border="0" src="../helen/footergif.gi f"></div>
</body>
</html>
Sajuks gave me a setup using all CSS. I am new and I could not figure this out. I'm offering my code, and I hoping you guys can step me through this.
my code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Langua
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
body
{
margin:0;
padding:0;
font:13px arial, verdana, sans-serif;
}
#container
{
min-width: 700px;
max-width: 1200px;
width: expression((this.parentNod
}
#header
{
background:#ffffff url('background-picture.gi
text-align:center;
/* no width needed */
height:188px
}
#header img
{
margin:0 auto;
display:block;
}
#leftcol
{
float:left;
width:33%;
}
#centercol
{
float:left;
width:33%;
text-align:center;
}
#rightcol
{
float:left;
width:33%;
}
.spacer
{
padding:10px 20px;
}
#leftcol p, #rightcol p
{
text-align:justify;
}
#footer
{
background:#ffffff url('widening-footer.gif')
text-align:center;
/* no width needed */
height:22px
}
#footer img2
{
margin:0 auto;
display:block;
}
img
{
border:none;
}
img2
{
border;none;
}
a:link, a:visited, a:hover, a:active
{
text-decoration:none;
</style>
</head>
<body>
<div id="container">
<div id="header" style="width: 100%; height: 190px">
<map name="FPMap0">
<area href="index.html" shape="rect" coords="430, 172, 487, 189">
<area href="more.html" shape="rect" coords="502, 174, 639, 189">
<area href="contact.html" shape="rect" coords="653, 174, 733, 189">
</map>
<img border="0" src="../helen/header.jpg" width="750" height="190" usemap="#FPMap0"></div>
<div id="leftcol" style="width: 33%; height: 283px">
<div class="spacer">
<p align="justify"><b><i>Here
<p align="justify">She has had periodicals printed
in five languages, by the 'Christian Science Publishing society'.<br>
<br>
She has been published in five large news papers and several small ones,
Idaho Farm Journal, and TV Guide.<br>
<br>
She has designed <a href="http://www.b-transfers.com/oreana">God and Country
stickers</a> for cars, doors, mailboxes, etc. and several Biblical games,
the games yet to be published.<br>
<br>
</p>
<p> </div>
</div>
<div id="centercol" style="width: 33%; height: 195px">
<div class="spacer">
<p style="text-align: justify">She has had two songs published and
recorded by her daughter, Betty Nanney Hillman. <br>
<br>
Her hobby and third love is swimming, writing, painting. Her second
love her children and grandchildren, including grates. She loves
special times with the grandchildren. Her first Love is God and His
Christ, "Jesus'.<br>
<br>
Her favorite movies are, "Ten Commandments", with Charlatan Heston,
Gone With the Wind," and "Passion of the Christ."<br>
<br>
Her favorite News castors are: O'Reilly, Greta, Shepherd Smith,
Sean, Heraldo, Beltway boys, Neil, most of Fox news casters. They
tell the Truth, and I like game shows that ask questions.<br>
<br>
</div>
</div>
<div id="rightcol" style="width: 33%; height: 245px">
<div class="spacer">
<div>
<p style="margin-top: -1px; margin-bottom: -1px"> </p>
<p style="margin-top: -1px; margin-bottom: -1px">Her favorite TV show is
700 Club, Shepherds Chapel, Bennie Hinn, Joyce Myers, Public Television,
Discovery Channel, Wild Kingdom, and all those type shows, plus
Diagnosis Murder, Murder She Wrote, Whose Line Is it. Most TV is a
waste. I like clean comedy shows.</p>
<p style="margin-top: -1px; margin-bottom: -1px"><br>
Goldie Haun and Charleston Heston are Helen's favorite actors. She has
spent over half of her life on the farm, and in land development.<br>
<br>
She loves all sports. </div>
<div>
</div>
<p>
<img border="0" src="../helen/pallet-trans
</div>
<div id="footer" style="width: 100%; height: 22px">
<img border="0" src="../helen/footergif.gi
</body>
</html>
ASKER
Oh, and I would like my colored column to be of fixed width.
<html>
<head>
<meta http-equiv="Content-Langua ge" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
body
{
margin:0;
padding:0;
font:13px arial, verdana, sans-serif;
}
#container
{
min-width: 700px;
max-width: 1200px;
width: expression((this.parentNod e.clientWi dth > 1200)?1200+"px":(this.pare ntNode.cli entWidth <= 700 + 0)?700+"px":"auto")
}
#header
{
background:#ffffff url('background-picture.gi f');
text-align:center;
/* no width needed */
height:188px
}
#header img
{
margin:0 auto;
display:block;
}
#leftcol
{
float:left;
width:33%;
background-color: red;
}
#centercol
{
float:left;
width:33%;
text-align:center;
background-color: pink;
}
#rightcol
{
float:left;
width:33%;
background-color: blue;
}
.spacer
{
padding:10px 20px;
}
#leftcol p, #rightcol p
{
text-align:justify;
}
#footer
{
background:#ffffff url('widening-footer.gif') ;
text-align:center;
/* no width needed */
height:22px
}
#footer img2
{
margin:0 auto;
display:block;
}
img
{
border:none;
}
img2
{
border;none;
}
a:link, a:visited, a:hover, a:active
{
text-decoration:none;
</style>
</head>
<body>
<div id="container">
<div id="header" style="width: 100%; height: 190px">
<map name="FPMap0">
<area href="index.html" shape="rect" coords="430, 172, 487, 189">
<area href="more.html" shape="rect" coords="502, 174, 639, 189">
<area href="contact.html" shape="rect" coords="653, 174, 733, 189">
</map>
<img border="0" src="../helen/header.jpg" width="750" height="190" usemap="#FPMap0"></div>
<div id="leftcol" style="width: 33%; height: 283px">
<div class="spacer">
<p align="justify"><b><i>Here is more about Helen:</i></b></p>
<p align="justify">She has had periodicals printed
in five languages, by the 'Christian Science Publishing society'.<br>
<br>
She has been published in five large news papers and several small ones,
Idaho Farm Journal, and TV Guide.<br>
<br>
She has designed <a href="http://www.b-transfers.com/oreana">God and Country
stickers</a> for cars, doors, mailboxes, etc. and several Biblical games,
the games yet to be published.<br>
<br>
</p>
<p> </div>
</div>
<div id="centercol" style="width: 33%; height: 195px">
<div class="spacer">
<p style="text-align: justify">She has had two songs published and
recorded by her daughter, Betty Nanney Hillman. <br>
<br>
Her hobby and third love is swimming, writing, painting. Her second
love her children and grandchildren, including grates. She loves
special times with the grandchildren. Her first Love is God and His
Christ, "Jesus'.<br>
<br>
Her favorite movies are, "Ten Commandments", with Charlatan Heston,
Gone With the Wind," and "Passion of the Christ."<br>
<br>
Her favorite News castors are: O'Reilly, Greta, Shepherd Smith,
Sean, Heraldo, Beltway boys, Neil, most of Fox news casters. They
tell the Truth, and I like game shows that ask questions.<br>
<br>
</div>
</div>
<div id="rightcol" style="width: 33%; height: 245px">
<div class="spacer">
<div>
<p style="margin-top: -1px; margin-bottom: -1px;"> </p>
<p style="margin-top: -1px; margin-bottom: -1px;">Her favorite TV show is
700 Club, Shepherds Chapel, Bennie Hinn, Joyce Myers, Public Television,
Discovery Channel, Wild Kingdom, and all those type shows, plus
Diagnosis Murder, Murder She Wrote, Whose Line Is it. Most TV is a
waste. I like clean comedy shows.</p>
<p style="margin-top: -1px; margin-bottom: -1px;"><br>
Goldie Haun and Charleston Heston are Helen's favorite actors. She has
spent over half of her life on the farm, and in land development.<br>
<br>
She loves all sports. </div>
<div>
</div>
<p>
<img border="0" src="../helen/pallet-trans parent.gif " width="152" height="97"></div>
</div>
<div id="footer" style="width: 100%; height: 22px">
<img border="0" src="../helen/footergif.gi f"></div>
</body>
</html>
<head>
<meta http-equiv="Content-Langua
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
body
{
margin:0;
padding:0;
font:13px arial, verdana, sans-serif;
}
#container
{
min-width: 700px;
max-width: 1200px;
width: expression((this.parentNod
}
#header
{
background:#ffffff url('background-picture.gi
text-align:center;
/* no width needed */
height:188px
}
#header img
{
margin:0 auto;
display:block;
}
#leftcol
{
float:left;
width:33%;
background-color: red;
}
#centercol
{
float:left;
width:33%;
text-align:center;
background-color: pink;
}
#rightcol
{
float:left;
width:33%;
background-color: blue;
}
.spacer
{
padding:10px 20px;
}
#leftcol p, #rightcol p
{
text-align:justify;
}
#footer
{
background:#ffffff url('widening-footer.gif')
text-align:center;
/* no width needed */
height:22px
}
#footer img2
{
margin:0 auto;
display:block;
}
img
{
border:none;
}
img2
{
border;none;
}
a:link, a:visited, a:hover, a:active
{
text-decoration:none;
</style>
</head>
<body>
<div id="container">
<div id="header" style="width: 100%; height: 190px">
<map name="FPMap0">
<area href="index.html" shape="rect" coords="430, 172, 487, 189">
<area href="more.html" shape="rect" coords="502, 174, 639, 189">
<area href="contact.html" shape="rect" coords="653, 174, 733, 189">
</map>
<img border="0" src="../helen/header.jpg" width="750" height="190" usemap="#FPMap0"></div>
<div id="leftcol" style="width: 33%; height: 283px">
<div class="spacer">
<p align="justify"><b><i>Here
<p align="justify">She has had periodicals printed
in five languages, by the 'Christian Science Publishing society'.<br>
<br>
She has been published in five large news papers and several small ones,
Idaho Farm Journal, and TV Guide.<br>
<br>
She has designed <a href="http://www.b-transfers.com/oreana">God and Country
stickers</a> for cars, doors, mailboxes, etc. and several Biblical games,
the games yet to be published.<br>
<br>
</p>
<p> </div>
</div>
<div id="centercol" style="width: 33%; height: 195px">
<div class="spacer">
<p style="text-align: justify">She has had two songs published and
recorded by her daughter, Betty Nanney Hillman. <br>
<br>
Her hobby and third love is swimming, writing, painting. Her second
love her children and grandchildren, including grates. She loves
special times with the grandchildren. Her first Love is God and His
Christ, "Jesus'.<br>
<br>
Her favorite movies are, "Ten Commandments", with Charlatan Heston,
Gone With the Wind," and "Passion of the Christ."<br>
<br>
Her favorite News castors are: O'Reilly, Greta, Shepherd Smith,
Sean, Heraldo, Beltway boys, Neil, most of Fox news casters. They
tell the Truth, and I like game shows that ask questions.<br>
<br>
</div>
</div>
<div id="rightcol" style="width: 33%; height: 245px">
<div class="spacer">
<div>
<p style="margin-top: -1px; margin-bottom: -1px;"> </p>
<p style="margin-top: -1px; margin-bottom: -1px;">Her favorite TV show is
700 Club, Shepherds Chapel, Bennie Hinn, Joyce Myers, Public Television,
Discovery Channel, Wild Kingdom, and all those type shows, plus
Diagnosis Murder, Murder She Wrote, Whose Line Is it. Most TV is a
waste. I like clean comedy shows.</p>
<p style="margin-top: -1px; margin-bottom: -1px;"><br>
Goldie Haun and Charleston Heston are Helen's favorite actors. She has
spent over half of her life on the farm, and in land development.<br>
<br>
She loves all sports. </div>
<div>
</div>
<p>
<img border="0" src="../helen/pallet-trans
</div>
<div id="footer" style="width: 100%; height: 22px">
<img border="0" src="../helen/footergif.gi
</body>
</html>
ASKER
RozanaZ,
I like the colored columns, now maybe you could help me make one of the columns fixed width.
Thank you,
Bob Weikel
I like the colored columns, now maybe you could help me make one of the columns fixed width.
Thank you,
Bob Weikel
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I need a setup that has a single fixed width column, and the other two columns to be "fluid" -- resize themselves based on how big of a window they are in.
Thank you,
Bob
Thank you,
Bob
ASKER
I like what sajuks was trying to offer me. I'm new and I get confused implimenting it. I want a fixed width for my first column and and I want the other two columns to stretch or shrink when the browser window size changes.
I'm putting down my code. Maybe someone could make the desired changes and put stars (*) next to what you change. Thank you.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Langua ge" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
body
{
margin:0;
padding:0;
font:13px arial, verdana, sans-serif;
}
#container
{
min-width: 700px;
max-width: 1200px;
width: expression((this.parentNod e.clientWi dth > 1200)?1200+"px":(this.pare ntNode.cli entWidth <= 700 + 0)?700+"px":"auto")
}
#header
{
background:#ffffff url('../helen/background-p icture.gif ');
text-align:center;
/* no width needed */
height:188px
}
#header img
{
margin:0 auto;
display:block;
}
#leftcol
{
float:left;
width:33%;
}
#centercol
{
float:left;
width:33%;
text-align:center;
}
#rightcol
{
float:left;
width:33%;
}
.spacer
{
padding:10px 20px;
}
#leftcol p, #rightcol p
{
text-align:justify;
}
#footer
{
background:#ffffff
text-align:center;
/* no width needed */
height:22px
}
#footer img2
{
margin:0 auto;
display:block;
}
img
{
border:none;
}
img2
{
border;none;
}
a:link, a:visited, a:hover, a:active
{
text-decoration:none;
}</style>
</head>
<body>
<div id="container">
<div id="header" style="width: 100%; height: 190px">
<map name="FPMap0">
<area href="../helen/index.html" shape="rect" coords="430, 172, 487, 189">
<area href="../helen/more.html" shape="rect" coords="502, 174, 639, 189">
<area href="../helen/contact.htm l" shape="rect" coords="653, 174, 733, 189">
</map>
<img border="0" src="../helen/header.jpg" width="750" height="190" usemap="#FPMap0"></div>
<div id="leftcol" style="width: 33%; height: 283px">
<div class="spacer">
<p>
<img border="0" src="../helen/index1.jpg" width="135" height="79"><p align="justify">
<font face="Arial" size="2">Welcome
to Helen's home page. Helen is an artist and this page has an art
theme. She likes to paint mountain scenes, landscapes, water, sky,
trees and rocks.</font> </p>
<p align="justify"><font face="Arial" size="2">Helen loves to paint.
She gives away her paintings to family members. She has done some
watercolors, but she focuses more on acrylic painting.</font></p>
<p align="justify"><font face="Arial" size="2">Helen loves to go for
walks. It's her form of exercise.</font></p>
</div>
</div>
<div id="centercol" style="width: 33%; height: 195px">
<div class="spacer">
<p style="text-align: left">
<font face="Arial" size="2">Helen is a grandmother, and she gives a
lot of support to her family. A lot of her life revolves around
them. She has many loving people that help her out, and she helps
the family out in whatever way she can.</font></p>
<p align="justify">
<font face="Arial" size="2">Helen is kind of new with computers, but
she loves working with them. She is running a bumper sticker
business online. Click here to see it.</font></p>
<p align="justify"><font face="Arial" size="2">Helen's favorite
movie is the Ten Commandments. Her favorite TV shows are Fox news ,
discovery channel, and public television.</font> </p>
<p align="justify"><font face="Arial" size="2">Helen loves to play
scrabble. She also loves to play pinochle and rummy, and she is a
good card player.</font></p>
<p align="justify">Helen attended High School at Homedale, Idaho,
and four years of College at Boise, State University, majoring in
Art, and Addiction counseling. Helen loves her teachers.
<p style="text-align: justify"><br>
<br>
</div>
</div>
<div id="rightcol" style="width: 33%; height: 245px">
<div class="spacer">
<div>
<p style="margin-top: -1px; margin-bottom: -1px"> </p>
<p style="margin-top: -1px; margin-bottom: -1px">Helen was part of a family band, "The Nannies" , for twenty nine years.
They played for <br>
clubs, rodeos, conventions, barn dances, dance halls, Indian
reservation, politicians, & others. She traveled during this time, to
Colorado, Wyoming, Montana, Oregon, Idaho, Washington, California, and
Nevada. <br>
<br>
She is the author of two books, "Journey Into the Light" and "Bear Face/
Toward The Setting Sun". The first book, "Journey" will be out in the
bookstores by December, and on line by November. " Bear Face" will be
out sometime at the end of the year. <br>
<br>
She has an article of 'Bear Face Dodge', in "They Made Wyoming Their
Own".</div>
<div>
</div>
<p> </div>
</div>
<div id="footer" style="width: 100%; height: 22px">
<p align="center">
<map name="FPMap1">
<area href="../helen/index.html" shape="rect" coords="69, 3, 129, 23">
<area href="../helen/more.html" shape="rect" coords="143, 3, 276, 23">
<area href="../helen/contact.htm l" shape="rect" coords="288, 5, 374, 23">
</map>
<img border="0" src="../helen/footer-copyr ight-jpg.j pg" usemap="#FPMap1"></div>
</body>
</html>
I'm putting down my code. Maybe someone could make the desired changes and put stars (*) next to what you change. Thank you.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Langua
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title></title>
<style type="text/css">
body
{
margin:0;
padding:0;
font:13px arial, verdana, sans-serif;
}
#container
{
min-width: 700px;
max-width: 1200px;
width: expression((this.parentNod
}
#header
{
background:#ffffff url('../helen/background-p
text-align:center;
/* no width needed */
height:188px
}
#header img
{
margin:0 auto;
display:block;
}
#leftcol
{
float:left;
width:33%;
}
#centercol
{
float:left;
width:33%;
text-align:center;
}
#rightcol
{
float:left;
width:33%;
}
.spacer
{
padding:10px 20px;
}
#leftcol p, #rightcol p
{
text-align:justify;
}
#footer
{
background:#ffffff
text-align:center;
/* no width needed */
height:22px
}
#footer img2
{
margin:0 auto;
display:block;
}
img
{
border:none;
}
img2
{
border;none;
}
a:link, a:visited, a:hover, a:active
{
text-decoration:none;
}</style>
</head>
<body>
<div id="container">
<div id="header" style="width: 100%; height: 190px">
<map name="FPMap0">
<area href="../helen/index.html"
<area href="../helen/more.html" shape="rect" coords="502, 174, 639, 189">
<area href="../helen/contact.htm
</map>
<img border="0" src="../helen/header.jpg" width="750" height="190" usemap="#FPMap0"></div>
<div id="leftcol" style="width: 33%; height: 283px">
<div class="spacer">
<p>
<img border="0" src="../helen/index1.jpg" width="135" height="79"><p align="justify">
<font face="Arial" size="2">Welcome
to Helen's home page. Helen is an artist and this page has an art
theme. She likes to paint mountain scenes, landscapes, water, sky,
trees and rocks.</font> </p>
<p align="justify"><font face="Arial" size="2">Helen loves to paint.
She gives away her paintings to family members. She has done some
watercolors, but she focuses more on acrylic painting.</font></p>
<p align="justify"><font face="Arial" size="2">Helen loves to go for
walks. It's her form of exercise.</font></p>
</div>
</div>
<div id="centercol" style="width: 33%; height: 195px">
<div class="spacer">
<p style="text-align: left">
<font face="Arial" size="2">Helen is a grandmother, and she gives a
lot of support to her family. A lot of her life revolves around
them. She has many loving people that help her out, and she helps
the family out in whatever way she can.</font></p>
<p align="justify">
<font face="Arial" size="2">Helen is kind of new with computers, but
she loves working with them. She is running a bumper sticker
business online. Click here to see it.</font></p>
<p align="justify"><font face="Arial" size="2">Helen's favorite
movie is the Ten Commandments. Her favorite TV shows are Fox news ,
discovery channel, and public television.</font> </p>
<p align="justify"><font face="Arial" size="2">Helen loves to play
scrabble. She also loves to play pinochle and rummy, and she is a
good card player.</font></p>
<p align="justify">Helen attended High School at Homedale, Idaho,
and four years of College at Boise, State University, majoring in
Art, and Addiction counseling. Helen loves her teachers.
<p style="text-align: justify"><br>
<br>
</div>
</div>
<div id="rightcol" style="width: 33%; height: 245px">
<div class="spacer">
<div>
<p style="margin-top: -1px; margin-bottom: -1px"> </p>
<p style="margin-top: -1px; margin-bottom: -1px">Helen was part of a family band, "The Nannies" , for twenty nine years.
They played for <br>
clubs, rodeos, conventions, barn dances, dance halls, Indian
reservation, politicians, & others. She traveled during this time, to
Colorado, Wyoming, Montana, Oregon, Idaho, Washington, California, and
Nevada. <br>
<br>
She is the author of two books, "Journey Into the Light" and "Bear Face/
Toward The Setting Sun". The first book, "Journey" will be out in the
bookstores by December, and on line by November. " Bear Face" will be
out sometime at the end of the year. <br>
<br>
She has an article of 'Bear Face Dodge', in "They Made Wyoming Their
Own".</div>
<div>
</div>
<p> </div>
</div>
<div id="footer" style="width: 100%; height: 22px">
<p align="center">
<map name="FPMap1">
<area href="../helen/index.html"
<area href="../helen/more.html" shape="rect" coords="143, 3, 276, 23">
<area href="../helen/contact.htm
</map>
<img border="0" src="../helen/footer-copyr
</body>
</html>
<style type="text/css">
.column-one
{
width: 66%;
background-color: #999999;
}
.column-two { margin-right: 66%; }
.column-three {margin-left: 75%;}
</style>
<div class="column-one">
A------
B------
B----
</div>
<div class="column-two">
<h2>column two</h2>
</div>
<div class="column-three">
<h2>column three</h2>
</div>