Jump to content

The evil spacing issues...


fighella

Recommended Posts

Does anyone know anything about a not-so-mythical PHP gap that occurs between tables and images...

 

It has completely boggled my mind.

 

Check out the examples on this page I am starting up. http://www.seasurfboards.com/seacell

 

I've got a few random gaps between some of the top header.. and I am pretty sure it's to do with the PHP and possibly the server defaults??? I could be completely wrong... but I thought you guys might be able to help. I've stripped out the style sheets and they keep happening. I am using the DRUPAL CMS (which runs on PHP).

 

Im definately a PHP newb, but I cant think of any other reason this happens... theres no gaps when I replace the page with straight HTML.

 

If anyone would like to see the code, let me know.

 

Thanks JD

Link to comment
Share on other sites

It's most likely has to do with some whitespace (spaces, tabs, new lines ect.) being added or removed when you have parts of the site being created by PHP or add PHP-code in between your markup:

 

Static HTML: Here is what a table might look like when you write it in your editor

<table>
    <tr>
        <td>A post headline</td>
    </tr>
    <tr>
        <td>Some body text</td>
        <td><img src="postpic.jpg"></td>
    </tr>

    <tr>
        <td>Another post headline</td>
    </tr>
    <tr>
        <td>Some other body text</td>
        <td><img src="postpic.jpg"></td>
    </tr>
</table>

 

 

HTML "created by PHP": The same table created by a while loop in PHP

<?php
echo "<table>";

while($row = mysql_fetch_array()) {

    echo "<tr>\n";
    echo "<td>\n" . $row['header'] . "</td>";
    echo "</tr>\n":
    echo "<tr>\n";
    echo "<td>" . $row['body'] . "</td>\n";
    echo "<td><img src='" . $row['pic'] . "'></td>\n";
    echo "</tr>\n";
}

echo "</table>";
?>


<!-- HTML outputted by above while() -->
<table>

<tr>
<td>A post headline</td>
</tr>
<tr>
<td>Some body text</td>
<td><img src='postpic.jpg'></td>
</tr>
<tr>
<td>Another post headline</td>
</tr>
<tr>
<td>Some other body text</td>
<td><img src='postpic.jpg'></td>
</tr>

</table>

 

 

PHP code mixed with HTML:

<html>
    <head>

        <?php
        if(something) {
            $page_title = "";
        }
        else {
            $page_title = "";
        }
        ?>

        <title><?php echo $page_title; ?></title>
    </head>

    <body>

        <?php
        $result = mysql_query("");

        while() {
            echo "<table>";
        }
        ?>

        <p>Some static HTML</p>

    </body>
</html>

 

In both "cases" with PHP some white space has disappeared or been added which could affect how the browser displays your markup, especially if you do not specify <!DOCTYPE > and stick to that "version" of html/xml. So thats my guess without seeing your code - if you want more detailed help you must post some code...

Link to comment
Share on other sites

Here is the code I am using. It is calling other php pages obviously...

 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="<?php print $language ?>" xml:lang="<?php print $language ?>">

<head>
  <title><?php print $head_title ?></title>
  <?php print $head ?>
  <?php print $styles ?>
  <?php print $scripts ?>
  <script type="text/javascript"><?php /* Needed to avoid Flash of Unstyle Content in IE */ ?> </script>
  <script type="text/javascript">

</script>
</head>

<body onload="MM_preloadImages('http://www.seasurfboards.com/seacell/themes/seatheme/images/boardsover.jpg','http://www.seasurfboards.com/seacell/themes/seatheme/images/artistsover.jpg','http://www.seasurfboards.com/seacell/themes/seatheme/images/apparelover.jpg','http://www.seasurfboards.com/seacell/themes/seatheme/images/accesoriesover.jpg')">

<table width="800" border="0" align="center">
  <tr>
    <td> </td>
    <td> </td>
    <td> </td> 
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td><img src="http://www.seasurfboards.com/seacell/themes/seatheme/images/seacell-web_03.jpg" alt="" width="807" height="161" /></td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td><table border="0" cellpadding="0" cellspacing="0" id="header" >
  <tr>
    <td id="logo">
      <?php if ($logo) { ?><a href="<?php print $base_path ?>" title="<?php print t('Home') ?>"><img src="<?php print $logo ?>" alt="<?php print t('Home') ?>" /></a><?php } ?>
      <?php if ($site_name) { ?><h1 class='site-name'><a href="<?php print $base_path ?>" title="<?php print t('Home') ?>"><?php print $site_name ?></a></h1><?php } ?>
      <?php if ($site_slogan) { ?><div class='site-slogan'><?php print $site_slogan ?></div><?php } ?>
    </td>
    <td id="menu"> </td>
  <!-- <?php if (isset($secondary_links)) { ?><?php print theme('links', $secondary_links, array('class' =>'links', 'id' => 'subnavlist')) ?><?php } ?>-->
<!--   <?php if (isset($primary_links)) { ?><?php print theme('links', $primary_links, array('class' =>'links', 'id' => 'navlist')) ?><?php } ?> -->
    <!-- <?php print $search_box ?> -->
   
  </tr>
  <tr>
    <td colspan="2"><div><?php print $header ?></div></td>
  </tr>
</table>

<table border="0" cellpadding="0" cellspacing="0" id="content">
  <tr>
    
    <td valign="top" style="margin: 0px; padding: 0px; border: 0px;">
      <?php if ($mission) { ?><div id="mission"><?php print $mission ?></div><?php } ?>
      <div id="main">
        <?php print $breadcrumb ?>
        <h1 class="title"><?php print $title ?></h1>
        <div class="tabs"><?php print $tabs ?></div>
        <?php print $help ?>
        <?php print $messages ?>
        <?php print $content; ?>
        <?php print $feed_icons; ?>
      </div>
    </td><?php if ($sidebar_left) { ?><td id="sidebar-left">
      <?php print $sidebar_left ?>
    </td><?php } ?>
    <?php if ($sidebar_right) { ?><td id="sidebar-right">
      <?php print $sidebar_right ?>
    </td><?php } ?>
  </tr>
</table>

<div id="footer">
  <?php print $footer_message ?>
</div>
<?php print $closure ?></td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
</table>
<p> </p>

</body>
</html>

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.