Little alignment issue

pmonett · Jun 7, 2010

I have a dynamic table populated by PHP code.

Two columns, the left is a bullet list, the right gets populated by data when the user clicks on a bullet item.

The issue is the following : when no bullet item has been clicked, the bullet list is positioned at the top of the table column (yes, valign is set to top), yet when an item is clicked and the right-hand column is populated, the bullet list drops by a few pixels.

Despite the fact that the alignment is set to top.

I'd like the bullet list to stay put. What can I do about it ?

Pascal.

I've got nothing to hide, and I'd very much like to keep that away from prying eyes.

Vragabond · Jun 7, 2010

Give us a link to the site or, failing that, part of the rendered (not php code) that illustrates the problem. Without seeing what you are working with, it is impossible for us to advise you.

[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

pmonett · Jun 7, 2010

You can see the issue here :

http://www.sharok.net/debug/fichiers.php

The php code is the following :

Code:

<html>
<head>
<title>Mini projet - liste de fichiers</title>
<link rel="stylesheet" type="text/css" href="./style.css" title="fichier1">
</head>
<body>
<?php
	include("start.php");
?>
<tr><td colspan="2" class="page_section">
<h1>Liste des fichier html</h1>
<table class="html_section"><tr><td class="file_section">
<?php
//cette section lit la liste des fichiers dans le répertoire html et crée une liste avec lien
	$authorized=array("html");
	$rep=opendir("./html");
	$fichiers[0]="";
    while($entree = readdir($rep)){
		$extention=substr($entree,strlen($entree)-4);
		if(in_array($extention,$authorized)){
			echo "<li><a href='fichiers.php?&file=$entree'>$entree</a></li>";
		}
    }
?>
<br/>
</td><td class="html_section">
<?php
//cette section vérifie s'il y a un paramètre - donc si un lien a été cliqué - et affiche le texte correspondant le cas échéant
	$param_file="";
	$param_file=isset($_REQUEST["file"])?$_REQUEST["file"]:".";
	if(strlen($param_file)>2){
		echo "<h2>$param_file</h2>";
		$filename="html/".$param_file;
		readfile($filename);
	}
?>
</td></tr></table>
<br/>
</td></tr>
<tr><td colspan="2" class="large_section"><br/><br/></td></tr>
</table>
</body>
</html>

Thank you for any observations.

Pascal.

I've got nothing to hide, and I'd very much like to keep that away from prying eyes.

Vragabond · Jun 7, 2010

This happens because of 'collapsing margins'. The concept is a little confusing, but most you should know is that having that heading (h2) there, pushes the content down, because heading has some margin on the top. Because of the collapsing margins, this margin appears for the whole table instead of just the h2 element. The link should provide a series of ways to avoid this gap. In your case, the easiest might be to zero out the top margin of the h2 element.

That said, your code is illegal, since you use list items (li) outside the list element (ul or ol). I would fix that as well, if I were fixing things on the page.

[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Little alignment issue

pmonett

Programmer

Vragabond

Programmer

pmonett

Programmer

Vragabond

Programmer

Similar threads

Part and Inventory Search

Sponsor