8791 sujets

Développement web côté serveur, CMS

Problème de d'alignement PHP

Salut,
J'ai 2soucis

1- L'alignement de "Rédigée par ..." qui se met tout en bas
2- J'aimerai faire comme ceci : http://img518.imageshack.us/img518/6140/83790106br0.png mais je n'y suis pas arrivé (même avec les tables)

Voici mon 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" xml:lang="fr" >
<head>
<title>Theoperation-Fr :: Le Site Des Fans Français De The Operation M.D.</title>
<?php include("***"); ?>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="style.css">
<style type="text/css">
h3
{
background-color:#212121;
display:block;
padding: 6px;
height: 15px;
color:#B62B24;
font-weight:bold;
font-size:12px;
font-family:Tahoma;
}

.title a {color:#B62B24;text-decoration:none;font-weight:bold;display:block;}
.title a:hover {color:#ffffff;text-decoration:none;}

.imgleft {float:left;padding-left:5px;width:85px;height:85px;}

.content {padding-left:5px;color:#ffffff;}

.editor
{
color:#888888;
font-family:Verdana;
font-size:10px;
padding-top:5px;
padding-left:15px;
clear: both;
}

.editor a {color:#999999;text-decoration:none;}
.editor a:hover {color:#B62B24;text-decoration:none;}


</style>
</head>
<body><br />
<div id="header"></div><br />
<div id="general">
<div id="main">
<?php
include("***");
?>
</div>
<div id="content">
<h1><img src="images/title/news.png" title="News" /></h1><p>
<?php
mysql_connect("localhost", "***", "***");
mysql_select_db("***");

$news = mysql_query('SELECT * FROM *** ORDER BY id DESC LIMIT 0, 10');

while($donnees = mysql_fetch_array($news))
{
?>
<span class="title"><h3 id="<?php echo $donnees['id']; ?>"><a href="#<?php echo $donnees['id']; ?>"><img src="images/icon_new_news.gif" /> <?php echo $donnees['title']; ?></a></h3></span>
<img src="<?php echo $donnees['image']; ?>" class="imgleft" /><span class="content"><?php echo $donnees['content']; ?></span>
<span class="editor"><p class="editor">Rédigée par <a href="mailto:<?php echo $donnees['email']; ?>"><?php echo $donnees['name']; ?></a> le <?php echo date('d/m/Y', $donnees['timestamp']); ?> </span>
<?php
} 
?><br />
</div>
<div id="footer"><?php include("***"); ?>
</div><br />
<?php include("***"); ?>
</body>
</html>


Voilà pour accéder et voir le décalage : http://dimeftp.free.fr/ftp/site/site3/index.php

C'est un peu bordelique mais sinon ça marche !

merci de pouvoir m'aider malgré que ce n'est pas très bien expliqué alors si vous avez des questions dites les moi ! Smiley smile
Salut Dime Smiley cligne ,

ton problème n'est pas un problème de PHP (code) mais de CSS (mise en page) Smiley smile .

Sinon, comme tu dis, ton code est un peu bordélique Smiley langue : ça à l'air un peu structuré au coup par coup et c'est un peu dur de s'y retrouver (avec nottament des balises <u> dans des <p>, des <p> ouverts et non fermés, des <br> un peu partout, etc...). Bref un petit ménage ferait le plus grand bien Smiley ravi !

Pour ta question, il me semble qu'il suffirait de mettre tes <h3> directement dans tes <div class="contentnews"> et de leur affecter un min-heigth de par exemple 200px pour que le <p>Rédigé par...</p> se place bien en dessous si ton texte n'est pas assez long. En clair :

html
<div class="news">
	<div class="contentnews">
		<h3>
			...
		</h3>
		<p>
			<img class="imgleft" />
		</p>
		<p>
			Du texte...
		</p>
	</div>
	<p class="clear">Rédigée par...</p> 
	
	<div class="contentnews">
		<h3>
			...
		</h3>
		<p>
			<img class="imgleft" />
		</p>
		<p>
			Du texte...
		</p>
	</div>
	<p class="clear">Rédigée par...</p> 
</div>

CSS
.contentnews { 
	height: 200px;
}

html>body .contentnews {
	height: auto;
	min-height: 200px;
}

Et pour finir, jouer un peu avec les margin et padding...

A+
Sujet clos
Aller à