You have learned the problems of using positioning absolute. Once used you have to use it all the time. It's good for placing a single element or two, but on a more complicated html page it's murder.
I used two major divs to hold stuff. container .. which held everything and word_holder .. for the two divs that had text.
I used margins and padding to position the divs. <center> is depreciated so I took it out. If you have questions ask:
Code:
<!DOCTYPE html Public "-//W3C//DTD XHTML 1.0 Transitional/En" http://www.w3.org/TR/xhtm1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Bio </title>
<style type="text/css">
a:link
{color:#000000; text-decoration:none;} /* unvisited link */
a:visited
{color:#000000; text-decoration:none;} /* visited link */
a:hover
{color:#E3170D;} /* mouse over link */
a:active
{color:#E3170D;} /* selected link */
.serif {
font-family:Helvetica;
font-size:11px;
}
.sansserif {
font-family:Helvetica;
font-size:11px;
line-height:130%;
}
body
{
background-color: #FFFFFF;
margin-top: 50px;
}
#container
{
width: 780px;
margin: auto;
}
#homelinksplacement
{
float:right;
}
img
{
border: 0px;
}
#allimages
{
height: 191px;
padding-left:10px;
padding-top:50px;
clear:right;
}
.menublock
{
background-color:#DCDCDC;
height:300px;
width:512px;
}
#textcontent
{
height:290px;
width:437px;
margin-left: 10px;
padding-right: 75px;
padding-top: 15px;
float:left;
background-color: #DCDCDC;
}
#othertextcontent
{
height:290px;
width:224px;
padding-top: 15px;
padding-left: 31px;
margin-left: 3px;
float:left;
background-color: #DCDCDC;
}
</style>
</head>
<body>
<div id="container">
<div id="homelinksplacement" class="serif">
<tr>
<td><a href = "home.html">HOME</a></td>
<td><a href = "bio.html">BIO</a></td>
<td><a href= "Gallery">GALLERY</a></td>
<td><a href= "Contact">CONTACT</a></td>
<td><a href= "Credits">CREDITS</a></td>
</tr>
</div>
<div id="allimages">
<img src="http://kyhryt.aisites.com/Bio1.jpg" width="254" height="191" alt="" />
<img src="http://kyhryt.aisites.com/Bio2.jpg" width="254" height="191" alt="" />
<img src="http://kyhryt.aisites.com/Bio5.jpg" width="254" height="191" alt="" />
</div>
<div id="word_holder">
<div id="textcontent" class="sansserif">
<h1> BIO: </h1>
Born October 6, 1948, Paula Scher is an internationally known Graphic Designer, illustrator, and art educator in design. Scher is mostly recognized for her work on the Boston album cover, the New York performing arts poster, Tiffany’s & Co. logo, as well as CitiBank logo.
In the world of graphic design, Scher has paved the way for women in the male dominated Graphics Design industry during the 70’s. Paula Scher recognition came from her talent of developing unique artistic concepts and illustrating them using typography.
Paula Scher, the 16th recipient of the School of Visual Art's Masters Series Award, started her career in New York City working as a layout artist for the Random House Children's book division. As Scher became more experience, she left the Random House Children's book division to start working for CBS Records in the advertising department, where she received several recognition for her designs.
</div>
<div id="othertextcontent" class="sansserif">
<h1> OTHER LINKS: </h1>
For more information about Paula Scher <br /> and her career, visit one links listed below.
<br />
<li> <a href="http://www.ted.com/speakers/paula_scher.html" target="_blank">TED - Paula Scher</a> </li>
<li> <a href="http://www.paulascher.com" target="_blank">Paula Scher Official Website</a> </li>
<li> <a href="http://www.pentagram.com/en/new/paula-scher/" target="_blank">Pentagram - Paula Scher</a> </li>
<li> <a href="http://www.allamericanspeakers.com/celebritytalentbios/Paula-Scher" target="_blank">America Speakers - Paula Scher</a> </li>
</div>
</div>
</div>
</body>
</html>