http://www.ilanasiegel.com/portfolio/
The container div isn't working which is causing my website to look jumbled.
The thumbnail images on the site are supposed to be to the right of Ilana Siegel and Resume instead of underneath.
Also,the images are in the right order in Safari but not in Firefox.
Please help!
HTML 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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Portfolio</title><!-- change name of page -->
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
<style>
body {
margin: 0;
padding: 0;
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif;<!-- change font here -->
font-size: 0.81em; <!-- font size -->
color: #b6d0d5; <!-- font color -->
}
/* header */
#container {
margin:auto;
width:1000px;
padding:0px;
}
#leftcolumn{
margin-top:0px;
width:204px;
height:890px;
}
#logo {
float: left;
margin-top: 0px;
margin-bottom: 0px;
margin-left:30px;
height: 30px;
width: 174px;
background: url(images/logo.gif) no-repeat;<!-- change your logo here and size above -->
}
#resume {
float:left;
margin-top:20px;
margin-bottom: 0px;
margin-left:0px;
margin-right:0px;
height: 30px;
width: 46px;
}
<!-- change your logo here and size above -->
h1 {
color: #fff;
font-size:1px;
}
/* body */
#rightcolumn{
float:left;
margin-top:30px;
margin-left:0px;
width:700px;
height:890px;
}
#section {
float: left;
margin-top: 0px;
margin-left: 0px;
width: 520px;
}
</style>
</head>
<body>
<div id="container">
<div id="leftcolumn"><div id="logo"><img src= "http://www.webmaster-talk.com/images/logo.gif"/></a>
<div id="resume"><a href="http://www.webmaster-talk.com/images/resume.pdf"><img src= "http://www.webmaster-talk.com/images/resume.png"/></a></div></div>
<div id="rightcolumn">
<div id="section">
<a href="http://www.webmaster-talk.com/images/02.png" rel="lightbox[roadtrip]" title="Green Building Series 1"><img src="http://www.webmaster-talk.com/images/02_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<a href="http://www.webmaster-talk.com/images/03.png"rel="lightbox[roadtrip]" title="Green Building Series 2"><img src="http://www.webmaster-talk.com/images/03_sm.png" width="150" HSPACE= "10" VSPACE= "6" height="100" alt="01" border="0" /></a>
<a href="http://www.webmaster-talk.com/images/04.png" rel="lightbox[roadtrip]" title="Green Building Series 3"><img src="http://www.webmaster-talk.com/images/04_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<br />
<a href="http://www.webmaster-talk.com/images/01.png" rel="lightbox[roadtrip]" title="Visiting Artist Lecture"><img src="http://www.webmaster-talk.com/images/01_sm.png" hspace= "10" vspace= "6" width="150" height="100" alt="01" border="0" /></a><a href="http://www.webmaster-talk.com/images/05.png" rel="lightbox[roadtrip]" title="Hillel at Home"><img src="http://www.webmaster-talk.com/images/05_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<a href="http://www.webmaster-talk.com/images/06.png"rel="lightbox[roadtrip]" title="Earth Day Calendar"><img src="http://www.webmaster-talk.com/images/06_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<br />
<a href="http://www.webmaster-talk.com/images/07.png" rel="lightbox[roadtrip]" title="Sherwin Williams Redesign"><img src="http://www.webmaster-talk.com/images/07_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<a href="http://www.webmaster-talk.com/images/08.png" rel="lightbox[roadtrip]" title="Green Tea Packaging"><img src="http://www.webmaster-talk.com/images/08_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a><a href="http://www.webmaster-talk.com/images/09.png"rel="lightbox[roadtrip]" title="Great Gatsby Cover Redesign"><img src="http://www.webmaster-talk.com/images/09_sm.png" hspace= "10" vspace= "6" width="150" height="100" alt="01" border="0" /></a><br />
<a href="http://www.webmaster-talk.com/images/10.png" rel="lightbox[roadtrip]" title="Heal Yourself: A Natural First Aid Guide"><img src="http://www.webmaster-talk.com/images/10_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<a href="http://www.webmaster-talk.com/images/11.png" rel="lightbox[roadtrip]" title="Heal Yourself: A Natural First Aid Guide Book Layouts"><img src="http://www.webmaster-talk.com/images/11_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
<a href="http://www.webmaster-talk.com/images/12.png"rel="lightbox[roadtrip]" title="Heal Yourself: A Natural First Aid Guide Illustrations"><img src="http://www.webmaster-talk.com/images/12_sm.png" HSPACE= "10" VSPACE= "6" width="150" height="100" alt="01" border="0" /></a>
</div>
</div>
</div>
</body>
</html>
Last edited by chrishirst; 06-17-2010 at 01:56 PM..
|
