Bonjour a tous, j'ai une page qui contient une div menu gauche et qui a l'interieur contient d'autre div.
Il y a un un des div, le div img, qui contient un lien hypertexte dans le HTML pour faire un popup qui ne prend pas en compte quand je lui met le parametre position absolute, il ce place toujours par raport au div juste au dessus de lui...
J'ai essayer sur le div qui est au dessus de lui et lui fonctionne tres bien en positon absolute, j'pense que sa doit venir qu'il y ai un lien hypertexte dans la div img...
Avez vous une solution?
Mon HTML:
Mon CSS:
Merci d'avance!!!
Modifié par Chat (14 May 2008 - 17:25)
Il y a un un des div, le div img, qui contient un lien hypertexte dans le HTML pour faire un popup qui ne prend pas en compte quand je lui met le parametre position absolute, il ce place toujours par raport au div juste au dessus de lui...
J'ai essayer sur le div qui est au dessus de lui et lui fonctionne tres bien en positon absolute, j'pense que sa doit venir qu'il y ai un lien hypertexte dans la div img...
Avez vous une solution?
Mon HTML:
</head>
<body>
<table id="page-table"><tr><td id="page-td">
<div id="conteneur">
<div id="menu_gauche">
<a href="pages/contact.html" target="contenu">contact</a>
<a href="pages/association.html" target="contenu">association</a>
<a href="pages/liens.html" target="contenu">Liens</a>
<a href="http://localhost/cpg1418/displayimage.php?album=lastup&cat=0&pos=5" target="contenu">membres</a>
<a href="galerie/galerie.php" target="contenu">galerie</a>
<a href="pages/auth.html" target="contenu">auth</a>
<?php
$serveur ="localhost";
$login = "root";
$mot_passe = "";
$base = "artkateo";
$connexion = mysql_pconnect($serveur, $login, $mot_passe) or die ("impossible de se connecter a MySQL : ".mysql_error());
$mabase = mysql_select_db($base) or die ("impossible de ce connecter ma table : ".mysql_error());
$requete = "select * from actualite";
$resultat = mysql_query($requete);
while ($row = mysql_fetch_row($resultat))
{
$titre = $row[1];
$date = $row[2];
$resume = $row[3];
echo stripslashes('<div id="titre">'.$titre.'</div>');
echo stripslashes('<div id="date">'.$date.'</div>');
echo stripslashes('<div id="resume">'.$resume.'</div>');
}
?>
<div id="img">
<A HREF="#" class="a" onClick="window.open('image_actu/actualite.jpg','_blank','toolbar=0, location=0, directories=0, status=0, scrollbars=yes, resizable=1, copyhistory=0, menuBar=0, width=460, height=470');return(false)">Cliquez ici<br />
pour<br />
voir le visuel</A> </div>
</div>
<div id="menu_haut"></div>
<div id="menu_droit"></div>
<div id="contenu">
<iframe name="contenu" src="" marginheight="0" marginwidth="0" width="460" height="470" scrolling="auto" frameborder="0">accueil</iframe>
</div>
<div id="bas_page"></div>
</div>
</td></tr></table>
</body>
</html>
Mon CSS:
*{
list-style-type: none;
margin : 0px;
padding:0px;
}
body{
font-family: "Times New Roman", Times, serif;
height: 100%;
background-color: #ffffff;
}
/*------------ Les 3 étapes suivantes sont pour centrer le contenu de la page */
.centrer {
margin-left: auto;
margin-right: auto;
width : 1000px;
text-align : left; /* pour résoudre le bug de centrage de IE */
}
#page-table {
height: 100%;
width: 100%;
border-collapse: collapse;
text-align: center;
}
#page-td {
height: 100%;
padding: 0;
vertical-align: middle;
}
/* ----------- Div principal (ou conteneur)*/
#conteneur{
position: relative;
margin-left: auto;
margin-right: auto;
text-align: left;
width: 810px;
height: 610px;
}
/*-------------Div du menu gauche */
#menu_gauche{
width: 280px;
height: 610px;
background-image: url(../images/menu_gauche.jpg);
}
/*-------------------Div du menu du haut */
#menu_haut{
position: absolute;
top: 0px;
width: 460px;
height: 90px;
margin-left: 280px;
background-image: url(../images/menu_haut.jpg);
}
#menu_droit{
position: absolute;
top: 0px;
margin-left: 740px;
width: 70px;
height: 610px;
background-image: url(../images/menu_droit.jpg);
}
#contenu{
position: absolute;
margin-left: 280px;
margin-bottom: 0px;
margin-right: 0px;
margin-top: 0px;
top: 90px;
width: 460px;
height: 470px;
}
#bas_page{
position: absolute;
margin-left: 280px;
top: 560px;
width: 460px;
height: 50px;
background-image: url(../images/bas.jpg);
}
#titre{
text-align: center;
white-space: normal;
font-weight: bold;
text-transform: uppercase;
margin-top: 40px;
margin-left: 30px;
margin-right: 70px;
font-family: Verdana,Geneva, Arial, Helvetica, sans-serif;
width: 180px;
color: White;
}
#date{
text-align: center;
text-transform: uppercase;
font-size: 15px;
white-space: normal;
margin-top: 10px;
margin-left: 30px;
margin-right: 70px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
width: 180px;
color: White;
}
#resume{
text-align: center;
word-spacing: -2px;
font-size: 11px;
white-space: normal;
margin-top: 15px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
margin-left: 30px;
margin-right: 70px;
width: 180px;
color: White;
}
#img{
position: absolute;
text-align: right;
word-spacing: -2px;
font-size: 11px;
margin-top: 50px;
margin-left: 30px;
margin-right: 70px;
width: 180px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
/*-------------Couleur des liens non visité */
.a:link {
text-decoration: none;
color: White;
}
/*-------------Couleur des liens visité */
.a:visited {
/*text-decoration: none;*/
color: White;
}
/*-------------Couleur des liens au survol de la souris */
.a:hover {
text-decoration: none;
color: White;
}
/*-------------Couleur des liens quand il y a le click */
.a:active {
text-decoration: none;
color: White;
}
Merci d'avance!!!
Modifié par Chat (14 May 2008 - 17:25)