[Resolu]Probleme mise en page IE

Question

getdown

14 Sep 2006 à 20:46

bonjour,
j'ai un probleme de presentation, sur firefox je n'ai aucun probleme alor que sur internet explorer ca fait un truc bizarre...
en gros comme vous pouvez le voir avec IE, le contenu integre dans ma page (ici news.php) se decalle en bas par rapport aux blocks de type float qui sont sur les coter .... a quoi est que ca peut etre du ?

voici l'adresse de mon site : <lien>http://getdown.goldzoneweb.info/index.php</lien>

je vous donner mes fichier :

css

#body_div {
font-family : trebuchet ms, verdana, sans sherif ;
font-size : 0.7em ;
width : 950px ;
margin : auto ;
padding : 0 ;
} 

h1 {
font-size : medium ;
text-align : center ;
padding : 0 ;
margin : 0 170px 10px ;
text-align : center ;
background : url(../images/haut.png) ;
border-bottom : 1px solid #5885e1 ;
}

h2 {
font-size : small;
padding : 0 ;
margin : 0;
padding-left : 10px;
text-align : center ;
background : url(../images/haut.png) ;
border-bottom : 1px solid #5885e1 ;
} 

h3 {
font-size : x-small;
padding : 0 ;
padding-left : 10px;
margin : 0 ;
text-align : left ;
background : url(../images/haut.png) ;
border-bottom : 1px solid #5885e1 ;
}

ul, li {
margin : 0 10px ;
padding : 0 ;
list-style-type: none;
}

/*En-tete*/
#header {
width : 100% ;
text-align : center ;
margin : 10px auto ;
}

#header img {
width : 100% ;
height : 180px ;
}

/* Menu de navigation rapide en haut */
#menu_haut {
text-align : right ;
margin : 0 0 20px 0 ;
padding : 0 ;
background : url(../images/haut.png) ;
border : 1px solid #5885e1 ;
height : 1.5em ;
}

#menu_haut li {
display : inline ;
margin : 0 ;
padding : 0 20px ;
border-left-width :  1px ;
border-left-style : solid ;
border-left-color : grey ;
}

#menu_haut a {
text-decoration : none ;
color : #000 ;
}

/*Colonne de gauche contenant le menu, le compteur...*/
#col_gauche {
float : left ;
width : 160px;
padding : 0 ;
margin : 0 ;
}

/*Presentation des cadres contenus dans la colonne de gauche.*/
.menu_gauche {
padding : 0 ;
margin : 0 ;
background : #f4f8fd ;
border : 1px solid #5885e1 ;
margin : 0 0 15px 0 ;
width : 100%;
}

.menu_gauche h3 {
margin: 0 0 3px ;
}

.menu_gauche dt {
border-bottom-width :  1px ;
border-bottom-style : solid ;
border-bottom-color : grey ;
padding : 5px 10px ;
}

.menu_gauche dd {
padding : 2px 10px ; 
}

.menu_gauche a {
color : #000 ;
text-decoration : none ;
}

.menu_gauche img {
width : 150px;
padding : 5px;
margin : auto;
text-align : center ;
}

/*Colonne de droite contenant l'espace membre, la musique...*/
#col_droite {
float : right ;
width : 130px;
padding : 0 ;
margin : 0 ;
}

#col_droite a {
text-decoration : none ;
color : #000 ;
}

#col_droite p {
text-align : center ;
}

/*Presentation des cadres contenus dans la colonne de droite*/
.cadres_droite {
border : 1px solid #5885e1 ;
margin : 0 0 15px 0 ;
padding : 0 0 2px ;
background : #f4f8fd ;
}

.cadres_droite span {
font-weight : bold ;
}

.cadres_droite li, ul, p  {
margin : 0 2px ;
}

/*Formulaires*/
form {
padding : 0 ;
text-align : center ;
margin : 10px auto ;
}

form input {
margin : 0;
}

.global {
margin : 15px 160px 15px 190px ;
border : 1px solid #5885e1 ;
padding : 0 ;
width : 600px;
}

.global li {
list-style-type: square;
list-style-position : inside;
margin : 15px;
}

.global th, td {
margin : 0 ;
padding : 5px 15px ;
}

.global p {
margin : 10px ;
}

.global span {
text-decoration : underline ;
}

.global h2 {
margin : 0 0 10px ;
}

.global a {
color : #000;
}

/*Pied de page*/
#pied_de_page {
clear : both ;
text-align : center ;
padding : 5px ;
margin-top : 20px ;
border-top : 2px solid #5885e1 ;
}

#pied_de_page img {
border : none ;
padding : 0 ;
margin : 5px;
height : 30px ;
}

#photos {
text-align: center;
}

#photos img {
max-width : 580px;
height : 440px;
border : 1px solid #5885e1 ;
margin : 0 auto 15px;

}

#photos h2 {
background : none ;
border : none ;
}

#miniatures_pel {
display : block;
overflow : auto;
clear : both;
height : 125px;
}

#miniatures {
float : left;
text-align: center;
}

#miniatures img {
height: 100px;
width : 100px;
padding : 0;
margin : 0 5px;
}

index.php :

<?php
if (isset($_POST['password']) && ($_POST['password']) == "") 
{
setcookie('authentification', $_POST['password']);
}
elseif (isset($_COOKIE['authentification']))
{
$_POST['password']=$_COOKIE['authentification'];
}
?>

<!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" xml:lang="fr" lang="fr">

<head>
<title>Bienvenue sur le blog de G3tDoWn !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<style type="text/css"> @import url(design/css/styles.css) ; </style>

<script type="text/javascript">
ejs_code_nb = 0;
function ejs_code_clavier(keyStroke)
        {
        ejs_code_code = "";
        ejs_code_eventChooser = (window.Event) ? keyStroke.which : event.keyCode;
        ejs_code_which = String.fromCharCode(ejs_code_eventChooser).toLowerCase();
        if(ejs_code_code.charAt(ejs_code_nb) == ejs_code_which)
                ejs_code_nb++;
        else
                ejs_code_nb=0;
        if(ejs_code_nb == ejs_code_code.length)
                {
                // METTEZ ICI L'ACTION DE VOTRE CHOIX
                document.getElementById('authentification').style.display='block';
                ejs_code_nb = 0;
                }
        }
document.onkeypress = ejs_code_clavier;
</script>
</head>

<body>

<div id="body_div">

<?php

if (!isset($_POST['password']) OR ($_POST['password']) != "13janvier")
{  
?>
<div id="authentification" style="display:none">
<form method="post" action="index.php"><p>Mot de passe : <input type="password" name="password" value=""><input type="submit" value="Valider"></p></form>
</div>
<?php
}

if (isset($_POST['password']) AND $_POST['password'] == "")
{
?>
<div id="menu_haut">
<ul>
<li><a href="index.php?page=accueil">Retour a l'accueil</a></li>
<li><a href="index.php?page=creer_page">Créer une page</a></li>
<li><a href="index.php?page=modif_page">Modifier une page</a></li>
<li><a href="index.php?page=rediger_news">Rediger une news</a></li>
<li><a href="index.php?page=liste_news">Liste des news</a></li>
<li><a href="index.php?page=liste_commentaires">Liste des commentaires</a></li>
</ul>
</div> 
<?php
}
?>

<div id="col_gauche">
<?php
include ('fiche_perso.php');
?> </div>

<!-- Compteur connectes -->
<div id="col_droite">
<div class="cadres_droite">
<h3>Frequentation...</h3>
<?php
$monfichier = fopen('compteur/compteur.txt', 'r+');

$pages_vues = fgets($monfichier); // On lit la première ligne (nombre de pages vues)
$pages_vues++; // On augmente de 1 ce nombre de pages vues
fseek($monfichier, 0); // On remet le curseur au début du fichier
fputs($monfichier, $pages_vues); // On écrit le nouveau nombre de pages vues

fclose($monfichier);

echo '<p>Pages visitées :' . $pages_vues . '</p>';
?>
</div>

<?php include('menu.php'); ?>

<p><a href="index.php">Retour a l'accueil</a></p>

</div>

<?php
//AFFICHAGE DES NEWS

//connection a la BDD
include ('admin/config_db.php');
mysql_connect($home, $login, $password);
mysql_select_db($base);

if (!isset($_GET['page'])) $page= 'accueil'; else $page= $_GET['page']; 
 switch($page)
{
case 'accueil' : include('news.php'); break;
case 'liste_news' : include('admin/liste_news.php'); break;
case 'rediger_news' : include('admin/rediger_news.php'); break;
case 'commentaires' : include('admin/commentaires.php'); break;
case 'liste_commentaires' : include('admin/liste_commentaires.php'); break;
case 'modif_page' : include('admin/admin_page.php'); break;
case 'creer_page' : include('admin/admin_page.php'); break;
case 'galeries' : include('galeries/galeries.php'); break;
}

//deconnection de la BDD
mysql_close();


?>

</div>
</body>

</html>

et news.php :

<?php 

$nombreDeMessagesParPage = 5;

$retour = mysql_query('SELECT COUNT(*) AS nb_messages FROM news');
$donnees = mysql_fetch_array($retour);
$totalDesMessages = $donnees['nb_messages'];

$nombreDePages  = ceil($totalDesMessages / $nombreDeMessagesParPage);

if (isset($_GET['page_news']))
{
    $page_news = $_GET['page_news'];
}
else
{
    $page_news = 1;
}

$premierMessageAafficher = ($page_news - 1) * $nombreDeMessagesParPage;

$retour = mysql_query('SELECT * FROM news ORDER BY id DESC LIMIT ' . $premierMessageAafficher . ', ' . $nombreDeMessagesParPage);

while($donnees=mysql_fetch_array($retour))
{
?>

<div class="global">

<h2><em><?php echo $donnees['titre']; ?></em></h2>

<p> <?php $contenu = nl2br(stripslashes($donnees['contenu']));
echo $contenu; ?> </p>

<center>
<p><a href="index.php?page=commentaires&amp;idnews=<?php echo $donnees['id']; 
?>&amp;titrenews=<?php echo stripslashes($donnees['titre']); ?>">Commentaires <!-- Atttention ! Ici, $donnees est l'array des news ! -->
(<?php /*Combien a-t-on de commentaires sur cette news ?*/
$infos_com = mysql_query('SELECT COUNT(*) AS nb_com FROM commentaires WHERE idnews=' . $donnees['id']);
$donnees_com = mysql_fetch_array($infos_com);
$totalDesCommentaires = $donnees_com['nb_com'];
echo $totalDesCommentaires;
?>)
</a>
</center>

<h3><em><?php echo 'Posté le' . date('d/m/Y à H\hi', $donnees['timestamp']); ?></em></h3>

</div>

<center>

<?php
}

echo 'Page : ';
for ($i = 1 ; $i <= $nombreDePages ; $i++)
{
    echo '<a href="index.php?page_news=' . $i . '">' . $i . '</a> ';
}

?>

</center>

merci d'avance pour vos reponse ....
Modifié par getdown (15 Sep 2006 - 20:16)

ghost

15 Sep 2006 à 00:46

Bonjour,

Je crois que c'est ton lien de nombre de page à la fin de tes news qui n'a pas de width donc se retrouve à 100% donc à 950px.

echo '<a href="index.php?page_news=' . $i . '">' . $i . '</a> ';

getdown

15 Sep 2006 à 20:16

j'ai trouver la solution, c'etait a cause de mon width: 600px; ds la calss "global", et depuis que je l'ai enlever c'est bon !
merci de votre aide !

keran

16 Sep 2006 à 01:17

salut

une petite erreur php :

if (isset($_POST['password']) && ($_POST['password']) == "") 
{
setcookie('authentification', $_POST['password']);
}
elseif (isset($_COOKIE['authentification']))
{
$_POST['password']=$_COOKIE['authentification'];
}

le elseif n'à rien à faire là puisqu'il n'y à pas de else...un if suffit si pas de else et à mon humble avis les tests d'authentification sont un peu faibles.une gestion des erreurs possibles surtout sur les get et includes sensibles...serait utile et un default sur le switch de la fin aussi.

center est invalide en strict Smiley cligne

getdown

16 Sep 2006 à 12:25

salut,

pour le center j'ai modifier mon site est maintenan valide au test W3C par contre pour le php je vais voir ca ... merci de me l'avoir montrer !
bye

Sujet clos

CSS et mise en forme, CSS3

[Resolu]Probleme mise en page IE