PHP page layout issue - photo spacing

tim_ver · March 21, 2007

I have an issue with top logos on a page not diplaying corectly. I have two logos on the webpages and they show up fine except the right logo is short by about 1 inch on the right side. I am not sure how to fix this issue. I have tried to change the sizes of the images and the percentage but no luck. I have pasted code below, please let me know what I am mising here please.

Code:

<tr>

<tr>

<? if(file_exists("./uploads/{$row['listing_id']}_logo_big.jpg")){ ?>

<img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" style="margin-right:15px;margin-bottom:15px;">

<?}?>

</div></td>

</tr>

</table></td>

Thanks

Iceman512 · March 21, 2007

Hi Tim_ver,

Obviously, you don't want to use CSS to style your page. I would recommend that you do, but otherwise... try this:

<table width="754" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr valign="top">
        <td width="5%"><img src="images/header2.jpg" width="490" height="141"></div></td>
          <td width="180%">
            <!--img src="images/set_right.jpg" width="500" height="141"-->
            <? if(file_exists("./uploads/{$row['listing_id']}_logo_big.jpg")){ ?>
            <img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" style="margin-right:15px;margin-bottom:15px;">
              <?}?>
            </div></td>
      </tr>
    </table></td>

Notice the 'valign' property in the <tr> tag.

Hope that helps.

Regards,

Iceman

tim_ver · March 21, 2007

Thanks

I tried this code and still have same issue of extra spacing on the right of the second logo. I have pasted the code above it also to se if this would help you or anyone more. I am using a background image for the back which is a solid color and 1px high by 1200 wide. So when the two images on top are there(they have white backgrounds) I still see on the top right some of the background image color as the two image are not covering up 100% of it. I even changed valin=top to center and right with no change.

Code:

<!--

body,td,th {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

}

body {

background-image: url(images/s.jpg);

background-repeat: repeat-y;

background-position:center;

background-color:#6C562D;

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

-->

</style></head>

<body>

<tr>

<? if(file_exists("./uploads/{$row['listing_id']}_logo_big.jpg")){ ?>

<img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" style="margin-right:15px;margin-bottom:15px;">

<?}?>

</div></td>

</tr>

</table></td>

</tr>

rcorlew · March 21, 2007

Code:

<style type="text/css">



</style></head>

<body>

<table width="754" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td><table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr valign="top">

<td width="5%"><img src="images/header2.jpg" width="490" height="141"></div></td>

<td width="180%">



<? if(file_exists("./uploads/{$row['listing_id']}_logo_big.jpg")){ ?>

<img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" style="margin-right:15px;margin-bottom:15px;">

<?}?>

</div></td>

</tr>

</table></td>

</tr>

The <tr valign="top"> should be <td valign="top">

Why are you nesting tables anyway?? It would be better if you tried using one table to divide out all the content and then use <div> to style the contents inside of the table.

Also you end a <div> twice without starting on like here:

<td width="5%"><img src="images/header2.jpg" width="490" height="141"></div></td>

and here:

<img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" style="margin-right:15px;margin-bottom:15px;">

<?}?>

</div></td>

tim_ver · March 21, 2007

ok I changed to Td but no change. What would be a cleaner meathod to this. I see you said using table to divide out all content. I am new to PHP, can you help out a little more with this please?

This is what I have now, but nothing changed, still not working.

code:

<!--

body,td,th {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

}

body {

background-image: url(images/s.jpg);

background-repeat: repeat-y;

background-position:center;

background-color:#6C562D;

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

}

-->

</style></head>

<body>

<tr>

<? if(file_exists("./uploads/{$row['listing_id']}_logo_big.jpg")){ ?>

<img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" style="margin-right:15px;margin-bottom:15px;">

<?}?>

</td>

</tr>

</table></td>

</tr>

Iceman512 · March 22, 2007

Hello again,

I feel your frustration... I've fiddled around with your code quite a bit, but I think this should work:

<!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=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<style type="text/css">
<!--
body,td,th {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
}
body {
   background-image:url(images/s.jpg);
   background-repeat:repeat-y;
   background-position:center;
background-color:#6C562D;
margin: 0px 0px 0px 0px;
}
-->
</style></head>
<body>
<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <td valign="top">
        <td><img src="images/header2.jpg" width="490" height="141"></td>
          <td>
            <!--img src="images/set_right.jpg" width="500" height="141"-->
            <? if(file_exists("./uploads/{$row['listing_id']}_logo_big.jpg")){ ?>
            <img src="uploads/<?=$row['listing_id'];?>_logo_big.jpg" align="left" border="0" hspace="0" vspace="0">
              <?}?>
            </td>
      </tr>
    </table></td>
  </tr>
</td>
</tr
</table>
</body>
</html>

If you want to specifically align each logo either left, right or center, just specify this in the <td> tags as align="left".

I do hope it works for you. I used to suffer for many hours with problems just like this... just keep it up and you'll crack it eventually.

Post again if you need more help.

Regards,

Iceman

tim_ver · March 24, 2007

I did get it to finally work, took me another 2 hours of changes to the code but I think I have it now.

Sign In

PHP page layout issue - photo spacing

Recommended Posts

tim_ver

Link to comment

Share on other sites

Iceman512

Link to comment

Share on other sites

tim_ver

Link to comment

Share on other sites

rcorlew

Link to comment

Share on other sites

tim_ver

Link to comment

Share on other sites

Iceman512

Link to comment

Share on other sites

tim_ver

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information