PDA

View Full Version : Annoying Design Problem

WillisTi
11-15-2005, 09:12 PM
Hi,

I have a couple of design issues with my photo gallery code. This is my previous (http://www.contemporarymultimedia.com/flickr/nature.htm) version using XHTML and CSS and works and looks fine.

This is what it now looks like since I recreated it using PHP (http://flickr.chrisbaines.co.uk/Flickr/showgallery.php) (sorry about the loading time).

As you can see there is no curve in the bottom left corner, the footer is all out of place and a big white rectangular line going up the page on the right hand side.

I must of messed up my code somewhere.

Anyone help me out? Its really annoying me. Ive included the code for both designs below if that will help.

Heres my previous version



<!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>FlickrBaby | Nature</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-gb" />

<link href="style.css" media="all" rel="stylesheet" />
</head>

<body id="portfolio">

<div id="container">
<div id="header">
<h1><a href="../" title="flickrbaby"><span>creativ<strong>types</strong></span></a></h1>
</div>
<div id="header-print"></div>

<div id="navigation">
<ul>
<li><a href="flickrbaby.htm">Home</a></li>
<li><a href="member.htm" class="selected">Member</a></li>
<li><a href="../information/">Explore</a></li>
<li><a href="../contact/">Support</a></li>
</ul>
</div>
<div id="content-portfolio">
<h3>Here's your <span class="txt">Photos</span></h3>
<p id="breadcrumb"><strong>Currently viewing:</strong> <a href="member.htm">member</a> &raquo; <strong>Nature</strong></p>

<div id="dirdesc">
<p>Below are you nature photos.</p>
</div>
<div id="gallery">
<div class="imgwrapper" style="height:160px;width:124px;text-align:center"><a href="nature-photos.htm"><img src="example1-small.gif" alt="Woods" width="120" height="90" border="0" /></a><a href="nature-photos.htm"><span>Sample 01</span></a></div>
<div class="imgwrapper" style="height:160px;width:124px;text-align:center"><a href="nature-photos-sample2.htm?file=./creative/corporate_id/corp_id_sample_02.jpg"><img src="example2-small.gif" alt="Sample 02" width="120" height="90" /><span>Sample 02</span></a></div>
<div class="imgwrapper" style="height:160px;width:124px;text-align:center"><a href="file:///D|/Documents and Settings/twillis/My Documents/UWE/Year 2/Data Schemes &amp; Applications/Assignment/Website/nature-photos-sample3.htm?file=./creative/corporate_id/corp_id_sample_03.jpg"><img src="example3-small.gif" alt="Sample 03" width="120" height="90" /><span>Sample 03</span></a></div>
<div class="imgwrapper" style="height:160px;width:124px;text-align:center"><a href="/portfolio/index.php?file=./creative/corporate_id/corp_id_sample_04.jpg"><img src="example1-small.gif" alt="Sample 04" width="120" height="90" /><span>Sample 04</span></a></div>
<div class="imgwrapper" style="height:160px;width:124px;text-align:center"><img src="example2-small.gif" alt="Sample 05" width="120" height="90" /><span>Sample 05</span></div>
<div class="imgwrapper" style="height:160px;width:124px;text-align:center"><a href="nature-photos.htm"><img src="example3-small.gif" alt="Sample 06" width="120" height="90" border="0" /></a><span>Sample 06</span></div>
</div>
</div>

<div id="footer">
<p>&nbsp;</p>
<div id="footer-designers">
<p>Designed by Timothy Willis <br />Chris Baines, Peter Williamson &nbsp; </p>
</div>
<div id="footer-uwe">
<p>t: 0117 9322836<br />
m: 07970 298622</p>
</div>
<div id="footer-email">
<p>&nbsp;<br />e:
<script type="text/javascript">
<!--
var username = "enquiries";
var hostname = "flickrbaby.com";
var linktext = username + "@" + hostname;
document.write("<a href=" + "mail" + "to:" + username + "@" + hostname + " title=" + linktext + ">" + linktext + "</a>");
//-->
</script>
</p>
</div>
<div id="footer-copyright">
<p>Copyright &copy; 2005 Flickr<strong>Baby</strong> &nbsp; <a href="">Sign Up </a> &nbsp; <a href="information.htm">About </a> &nbsp; <a href="">Contact </a> &nbsp; <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">Valid CSS</a> &nbsp; <a href="http://validator.w3.org/check?uri=referer" target="_blank">Valid XHTML</a></p>
</div>
</div>
</div>

</body>

</html>



Heres the new version (design problem)



<!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>FlickrBaby | Nature</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-gb" />

<link href="style.css" media="all" rel="stylesheet" />
</head>

<body id="portfolio">

<div id="container">
<div id="header">
<h1><a href="../" title="flickrBaby"><span>my<strong>gallery</strong></span></a></h1>
</div>
<div id="header-print"></div>

<div id="navigation">
<ul>
<li><a href="flickrbaby.htm">Home</a></li>
<li><a href="member.htm" class="selected">Member</a></li>
<li><a href="../information/">Explore</a></li>
<li><a href="../contact/">Support</a></li>
</ul>
</div>
<div id="content-portfolio">
<h3>Here's your <span class="txt">Photos</span></h3>
<p id="breadcrumb"><strong>Currently viewing:</strong> <a href="member.htm">member</a> &raquo; <strong>Nature</strong></p>

<div id="dirdesc">
<p>Below are you nature photos.</p>
</div>
<div id="gallery">
<div class="imgwrapper" style="height:160px;width:124px;text-align:center">
<?php
require_once('albumdb.php');
include "album_config.inc.php";

$offset = isset($_GET['offset']) ? $_GET['offset'] : 0;
$offsetOriginal = $offset;
$photoQueryResult = retrieve_album_page($offset);
$totalRows = mysql_numrows($photoQueryResult);
?>

<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="680" id="AutoNumber1">
<?php while ($row = mysql_fetch_array($photoQueryResult)) : ?>
<?php
$photoId = $row['photoId'];
$title = $row['title'];
$offset++;
?>
<div class="float">
<a href="mainphoto.php?photoid=<?=$photoId?>&offset=<?=$offsetOriginal?>">
<img src="<?=IMAGE_PATH.$photoId?>" width="<?=THUMBNAIL_WIDTH?>" height="<?=THUMBNAIL_HEIGHT?>" border="0" alt="<?=$title?>" />
</a>
<br />
<p><?=$title?></p>
</div>
<?php endwhile; ?>
<div>
<p>
<?=previous_page($offset, $totalRows)?>
<br />
<?=next_page($offset)?>
</p>
</div>
</div>
<div id="footer">
<p>&nbsp;</p>
<div id="footer-designers">
<p>Designed by Timothy Willis <br />Chris Baines, Peter Williamson &nbsp; </p>
</div>
<div id="footer-uwe">
<p>t: 0117 9322836<br />
m: 07970 298622</p>
</div>
<div id="footer-email">
<p>&nbsp;<br />e:
<script type="text/javascript">
<!--
var username = "enquiries";
var hostname = "flickrbaby.com";
var linktext = username + "@" + hostname;
document.write("<a href=" + "mail" + "to:" + username + "@" + hostname + " title=" + linktext + ">" + linktext + "</a>");
//-->
</script>
</p>
</div>
<div id="footer-copyright">
<p>Copyright &copy; 2005 Flickr<strong>Baby</strong> &nbsp; <a href="">Sign Up </a> &nbsp; <a href="information.htm">About </a> &nbsp; <a href="">Contact </a> &nbsp; <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">Valid CSS</a> &nbsp; <a href="http://validator.w3.org/check?uri=referer" target="_blank">Valid XHTML</a></p>
</div>
</div>
</div>
<body>
<html>



Anyone see what ive done wrong?

Thanks
harbingerOTV
11-16-2005, 03:06 AM
<div id="footer-copyright">
<p>Copyright &copy; 2005 Flickr<strong>Baby</strong> &nbsp; <a href="">Sign Up </a> &nbsp; <a href="information.htm">About </a> &nbsp; <a href="">Contact </a> &nbsp; <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">Valid CSS</a> &nbsp; <a href="http://validator.w3.org/check?uri=referer" target="_blank">Valid XHTML</a></p>
</div>
</div>
</div>
</div>

</body>

</html>


add that extra div and see if that fixes it. it looks like you just missed one.
WillisTi
11-16-2005, 09:15 AM
Still looking the same im afraid. Any other suggestions?
WillisTi
11-16-2005, 12:19 PM
Ive fixed the top part now but the bottom part is still messed up. In particular there is no bottom left corner.

Any suggestions?
ronaldb66
11-16-2005, 12:42 PM
Could you provide a link to the generated page? Without a look at the actual markup it's going to be near impossible to nail the problem.

Shoot; missed the links provided previously... :o

By the way: what's this:
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="680" id="AutoNumber1">
doing in there?!!
ronaldb66
11-16-2005, 12:51 PM
Okay, new attempt, you having read everything a little more carefully:

After:<div class="imgwrapper" style="height:160px;width:124px;text-align:center"> there seems to be a document starting all over again: <!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" xml:lang="en" lang="en">
<head>
<title>My Photo Album</title>
... etc.
Furthermore, surrounding the floated divs holding the photos there's an empty table without any table rows or cells (see previous post); this may very well throw off the alignment of the bottom rounded corner.
WillisTi
11-16-2005, 01:27 PM
I dont understand why there are two doctypes in the code. When i view my showgallery.php code not in a browser (the same above ) it doesnt show it, but how come when the right click and view the source theres another doctype?

Im confused now.
WillisTi
11-16-2005, 01:40 PM
Ah found it. It comes from my album_config.inc.php code (near the bottom)



<?php

# thumbnail width and height

define("THUMBNAIL_WIDTH", "130");
define("THUMBNAIL_HEIGHT", "100");

# maximum number of photos displayed on an album page

define("MAX_DISPLAYED_PHOTOS","8");

# The image directory's relative and absolute path

define("IMAGE_PATH", "photo.php?photoid=");

# Connect to the MySQL server and select the database

//require_once('albumdb.php');



#
# Function: retrieve_album_page()
# Purpose: Retrieve a page of photo information from MySQL database
#

function retrieve_album_page($offset)
{

$rows = MAX_DISPLAYED_PHOTOS;

$query = "SELECT photoId, photo, title
FROM photo ORDER BY date desc LIMIT $offset, $rows";

$result = mysql_query($query);

return $result;

}

#
# Function: next_page()
# Purpose: Determine whether another page of photos is available for perusal
#

function next_page($offset)
{
$photoCount = retrieve_photo_count();

if ($offset < $photoCount) {
return "<a href='showgallery.php?offset=$offset'>Next Page</a> >>";
} else {
return "";
}
}

#
# Function: previous_page()
# Purpose: Determine whether a previous page of photos is available for perusal
#

function previous_page($offset, $totalRows)
{

if ($offset - MAX_DISPLAYED_PHOTOS > 0)
{
$offset = $offset - $totalRows - MAX_DISPLAYED_PHOTOS;
return "<< <a href='showgallery.php?offset=$offset'>Previous Page</a>";
} else {
return "";
}
}

#
# Function: retrieve_photo_count()
# Purpose: Determine total number of photos in album
#

function retrieve_photo_count()
{

$countQuery = "SELECT count(photoId) as photoCount FROM photo";

$countResult = mysql_query($countQuery);

return mysql_result($countResult,0,"photoCount");

}

#
# Function: retrieve_photo()
# Purpose: Retrieve information specific to a particular photo
#

function retrieve_photo($photoId)
{
$query = "SELECT photoID, photo, title, FROM photo WHERE photoIi='$photoId'";

$result = mysql_query($query);

return $result;

}

?>
<!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" xml:lang="en" lang="en">
<head>
<title>My Photo Album</title>

<style type="text/css">
div.float {
float: left;
padding: 5px;
}
div.float p {
text-align: center;
margin-top: 2px;
}
p
{
font: 11px arial, "times new roman"
}
</style>
</head>

<body>



Should i just delete the code from end of the php down?
_Aerospace_Eng_
11-16-2005, 01:45 PM
Keep the styles, move them into the head tags of your main page delete the rest of the stuff after the php on the album_config.inc page.
WillisTi
11-16-2005, 02:18 PM
Done that now, but it still looks the same for the some reason? Must be something else? Can you notice anything else wrong with the code?

Ronald:


<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="680" id="AutoNumber1">


My friend (who i am working with) said the gallery is kept inside that table and makes sure the photos are 4 on top and 4 on bottom.
_Aerospace_Eng_
11-16-2005, 04:10 PM
Lose that table, it isn't structured properly anyways. Keep the div floats, give those a width in the CSS, something like 130px wide should be fine, then in your imgwrapper div set its width to 680. You also have an extra body tag just before that div.
WillisTi
11-16-2005, 05:43 PM
Would you be able to put that in the code for me please? If i give the image div a width of 680 wouldnt that make it look a bit weird, could be wrong though? Wheres that extra body div, i cant find it?

The current version is below with the table removed:



<!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>FlickrBaby | Nature</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-gb" />

<link href="style.css" media="all" rel="stylesheet" />
<style type="text/css">
div.float {
float: left;
padding: 5px;
}
div.float p {
text-align: center;
margin-top: 2px;
}
p
{
font: 11px arial, "times new roman"
}
</style>

</head>

<body id="portfolio">

<div id="container">
<div id="header">
<h1><a href="../" title="flickrBaby"><span>my<strong>gallery</strong></span></a></h1>
</div>
<div id="header-print"></div>

<div id="navigation">
<ul>
<li><a href="flickrbaby.htm">Home</a></li>
<li><a href="member.htm" class="selected">Member</a></li>
<li><a href="../information/">Explore</a></li>
<li><a href="../contact/">Support</a></li>
</ul>
</div>
<div id="content-portfolio">
<h3>Here's your <span class="txt">Photos</span></h3>
<p id="breadcrumb"><strong>Currently viewing:</strong> <a href="member.htm">member</a> &raquo; <strong>Nature</strong></p>

<div id="dirdesc">
<p>Below are you nature photos.</p>
</div>
<div id="gallery">
<div class="imgwrapper" style="height:160px;width:124px;text-align:center">
<?php
require_once('albumdb.php');
include "album_config.inc.php";

$offset = isset($_GET['offset']) ? $_GET['offset'] : 0;
$offsetOriginal = $offset;
$photoQueryResult = retrieve_album_page($offset);
$totalRows = mysql_numrows($photoQueryResult);
?>

<?php while ($row = mysql_fetch_array($photoQueryResult)) : ?>
<?php
$photoId = $row['photoId'];
$title = $row['title'];
$offset++;
?>
<div class="float">
<a href="mainphoto.php?photoid=<?=$photoId?>&offset=<?=$offsetOriginal?>">
<img src="<?=IMAGE_PATH.$photoId?>" width="<?=THUMBNAIL_WIDTH?>" height="<?=THUMBNAIL_HEIGHT?>" border="0" alt="<?=$title?>" />
</a>
<br />
<p><?=$title?></p>
</div>
<?php endwhile; ?>
<div>
<p>
<?=previous_page($offset, $totalRows)?>
<br />
<?=next_page($offset)?>
</p>
</div>
</div>
<div id="footer">
<p>&nbsp;</p>
<div id="footer-designers">
<p>Designed by Timothy Willis <br />Chris Baines, Peter Williamson &nbsp; </p>
</div>
<div id="footer-uwe">
<p>t: 0117 9322836<br />
m: 07970 298622</p>
</div>
<div id="footer-email">
<p>&nbsp;<br />e:
<script type="text/javascript">
<!--
var username = "enquiries";
var hostname = "flickrbaby.com";
var linktext = username + "@" + hostname;
document.write("<a href=" + "mail" + "to:" + username + "@" + hostname + " title=" + linktext + ">" + linktext + "</a>");
//-->
</script>
</p>
</div>
<div id="footer-copyright">
<p>Copyright &copy; 2005 Flickr<strong>Baby</strong> &nbsp; <a href="">Sign Up </a> &nbsp; <a href="information.htm">About </a> &nbsp; <a href="">Contact </a> &nbsp; <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">Valid CSS</a> &nbsp; <a href="http://validator.w3.org/check?uri=referer" target="_blank">Valid XHTML</a></p>
</div>
</div>
</div>
</div>
</body>
</html>



Thanks
ronaldb66
11-17-2005, 09:12 AM
I validated the page (http://validator.w3.org/check?uri=http%3A%2F%2Fflickr.chrisbaines.co.uk%2FFlickr%2Fshowgallery.php), and besides a whole pile of unescaped ampersands (you may want to fix that one for argument's sake), down the bottom the validator reports a missing p end tag (improper, but no biggie; should be fixed, though) and a missing div end tag (this is serious trouble!); it pairs it to the "container" div, but it might be a previous one.

Add the missing end tag right before the body end tag and see if that fixes things; otherwise, you'll need to track back which div isn't closed off properly.
WillisTi
11-17-2005, 09:45 AM
Heres how my current code looks like, still no luck.



<!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>FlickrBaby | Nature</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-gb" />

<link href="style.css" media="all" rel="stylesheet" />
<style type="text/css">
div.pos {
float: left;
padding: 5px;
}
div.pos p {
text-align: center;
margin-top: 2px;
}
p
{
font: 11px arial, "times new roman"
}
</style>

</head>

<body id="portfolio">

<div id="container">
<div id="header">
<h1><a href="../" title="flickrBaby"><span>my<strong>gallery</strong></span></a></h1>
</div>
<div id="header-print"></div>

<div id="navigation">
<ul>
<li><a href="flickrbaby.htm">Home</a></li>
<li><a href="member.htm" class="selected">Member</a></li>
<li><a href="../information/">Explore</a></li>
<li><a href="../contact/">Support</a></li>
</ul>
</div>
<div id="content-portfolio">
<h3>Here's your <span class="txt">Photos</span></h3>
<p id="breadcrumb"><strong>Currently viewing:</strong> <a href="member.htm">member</a> &raquo; <strong>Nature</strong></p>

<div id="dirdesc">
<p>Below are you nature photos.</p>
</div>
<div id="gallery">
<div class="imgwrapper" style="height:160px;width:124px;text-align:center">
<?php
require_once('albumdb.php');
include "album_config.inc.php";

$offset = isset($_GET['offset']) ? $_GET['offset'] : 0;
$offsetOriginal = $offset;
$photoQueryResult = retrieve_album_page($offset);
$totalRows = mysql_numrows($photoQueryResult);
?>
<div style="border:#111111; width:580px;" id="AutoNumber1">
<?php while ($row = mysql_fetch_array($photoQueryResult)) : ?>
<?php
$photoId = $row['photoId'];
$title = $row['title'];
$offset++;
?>
<div class="pos">
<a href="mainphoto.php?photoid=<?=$photoId?>&offset=<?=$offsetOriginal?>">
<img src="<?=IMAGE_PATH.$photoId?>" width="<?=THUMBNAIL_WIDTH?>" height="<?=THUMBNAIL_HEIGHT?>" border="0" alt="<?=$title?>" />
</a>
<br />
<p><?=$title?></p>
</div>
<?php endwhile; ?>
<div>
<p> <br />
<?=previous_page($offset, $totalRows)?>
<br />
<?=next_page($offset)?>
</p>
</div>
</div>
</div>
<div id="footer">
<p>&nbsp;</p>
<div id="footer-designers">
<p>Designed by Timothy Willis <br />Chris Baines, Peter Williamson &nbsp; </p>
</div>
<div id="footer-uwe">
<p>t: 0117 9322836<br />
m: 07970 298622</p>
</div>
<div id="footer-email">
<p>&nbsp;<br />e:
<script type="text/javascript">
<!--
var username = "enquiries";
var hostname = "flickrbaby.com";
var linktext = username + "@" + hostname;
document.write("<a href=" + "mail" + "to:" + username + "@" + hostname + " title=" + linktext + ">" + linktext + "</a>");
//-->
</script>
</p>
</div>
<div id="footer-copyright">
<p>Copyright &copy; 2005 Flickr<strong>Baby</strong> &nbsp; <a href="">Sign Up </a> &nbsp; <a href="information.htm">About </a> &nbsp; <a href="">Contact </a> &nbsp; <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">Valid CSS</a> &nbsp; <a href="http://validator.w3.org/check?uri=referer" target="_blank">Valid XHTML</a></p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
ronaldb66
11-17-2005, 11:56 AM
In your original example, the "footer" div that holds the corner graphic is the last child of the "container" div, aligning it in the proper place in the left bottom corner for the graphic to line up correctly.

In your PHP example, the end tag of the "footer" div is followed by two extra div end tags, placing the "footer" div in an entirely different place in the structure.

You need to find out which two divs those extra end tags belong to and place them in the proper place in the markup so your "footer" div is once again the last child of your "container" div.

To visualise the structure, you could set a thin red border on all divs so you can roughly see which one is a child of which.
You could also hazard a guess and move the two extra div end tags before the "footer" div starting tag, but if you don't know what effect this has on the structure, there's a risk of running into new problems.
WillisTi
11-17-2005, 12:21 PM
Thanks Ronald at least you've found the cause of the problem now, which is great. I'll look into doing it now and if i have any problems i'll post.

Thanks again
WillisTi
11-17-2005, 12:39 PM
Nearly fixed now, i placed the two extra div end tags before the "footer" div starting tag and it did the job.

Only thing now is the left pink is too long, can i fix that? The text seems smaller as well.

Thanks
ronaldb66
11-17-2005, 12:56 PM
Looks like that text is just a smidgin' too long to fit in 150px so the last blank wraps around to the next line. You might want to try an em width, which should scale with the text size. That is, if you specify the text sizes for all texts in scalable units so people can scale those texts, which would cause wrapping anyway.
Currently, the image bylines and footer texts aren't scalable in IE due to the use of px in the extra internal style sheet; this seems to cause them to look smaller then before, too.
WillisTi
11-17-2005, 01:20 PM
Yeah sorted that out now, shortened our names. Everything looking ok your end?

Ive got to do the other pages now wish me luck!

Thanks for all your help.
WillisTi
11-17-2005, 02:49 PM
Problems. After paying attention of getting the design to look right in IE for Windows it doesnt look so healthy in Firefox. Its just the footer is messed up it needs to go below the nextpage>>
ronaldb66
11-17-2005, 04:09 PM
Sorry; can't help you out: I haven't got anything besides IE around.

All I can suggest is: check that your structure, especially the bit above the footer, is sound; I saw a whole bunch of div end tags there. It validates, so the number fits the starting tags, but that doesn't necessarily mean is a proper structure!

The display issue might be related to floats, or not clearing them properly; at any rate, FireFox should be considered the "better" (more compliant) browser here, so you really should get it working there first, then hack -sorry, patch- for IE.
]|V|[agnus
11-17-2005, 06:28 PM
You've still got a lot of validation errors/warnings, as well as some code that is just pointless and gets in the way of analyzing the real problems. For instance...

<p>&nbsp;</p>

... at the start of the footer. This type of thing appears many places. Smacks of WYSIWIG editing. Also, something like...

<div>
<p> <br />

<br />
<a href='showgallery.php?offset=8'>Next Page</a> >>
</p>

</div>

What on earth are those breaks for? And just a detail, but why wouldn't the arrows be part of the button to go next?

Looking at the rendered layout, and then the source, I have a hard time imagining why you need so many <div />s.

Anyway, clean up all the junk, fix your errors and minimize your markup and you'll have a much easier time debugging this type of stuff.
WillisTi
11-17-2005, 07:40 PM
Yep im going to do that. Thanks
WillisTi
11-25-2005, 02:00 PM
thanks