Problème résolution CSS avec un menu image

Fermé
Milicy - 14 nov. 2008 à 14:43
 Utilisateur anonyme - 14 nov. 2008 à 16:25
Bonjour,
Je suis en trin de créer un site web et j'ai un gros problème. Je sais que se sujet reviens souvent mais après avoir consulté mainte et mainte fois de nombreux sites je ne trouve pas les bonnes solutions. Donc j'ai développé le site sous une résolution de 1200*800 j'aimerai tout simplement qu'il passe sous toute les résolution. Le souci viens de mon menu en image sous forme de tableau avec rollovers, je n'arrive pas a le dimensionner et surtout a le faire s'aligner avec le cadre de mon contenu quand la résolution varie. La technique qui me plaie le plus serai de faire des marges à droite et a gauche du site. Après beaucoup d'essais le menu ne s'adapte toujours pas, je viens prendre vos conseils. En espérant avoir des réponses de votre part, je vous fournis mais vierges.

Le code PHP : Index.php
<?php ?>
<html>
<head>
	<script type="text/javascript"></script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="preloadImages();" oncontextmenu="return bloc()">
<div id="conteneur">
	<div id="banières">
		<img width="993" height="115" src="Banniere_animee.gif" border="0">
	</div>
	<div id="contact">
		<img width="275" height="115" src="fun.JPG" border="0" title="Pour me 			contacter !"></a>
	</div>
	<div id="menu">
<table id="Tableau_01" width="275" height="600" border="0" cellpadding="0" 	cellspacing="0">
	<tr><td>
			<a href="index.php"
			onmouseover="changeImages('Menugratte_01', 'Menugratte/Menugratte_01-over.gif'); return true;"
				onmouseout="changeImages('Menugratte_01', 'Menugratte/Menugratte_01.gif'); return true;"
				onmousedown="changeImages('Menugratte_01', 'Menugratte/Menugratte_01-over.gif'); return true;"
				onmouseup="changeImages('Menugratte_01', 'Menugratte/Menugratte_01-over.gif'); return true;">
				<img name="Menugratte_01" src="Menugratte/Menugratte_01.gif" width="275" height="84" border="0" alt="Accueil"></a>
	</td></tr>
.........
	<tr><td>
			<a href="Prive/connection.php"
				onmouseover="changeImages('Menugratte_07', 'Menugratte/Menugratte_07-over.gif'); return true;"
				onmouseout="changeImages('Menugratte_07', 'Menugratte/Menugratte_07.gif'); return true;"
				onmousedown="changeImages('Menugratte_07', 'Menugratte/Menugratte_07-over.gif'); return true;"
				onmouseup="changeImages('Menugratte_07', 'Menugratte/Menugratte_07-over.gif'); return true;">
				<img name="Menugratte_07" src="Menugratte/Menugratte_07.gif" width="275" height="89" border="0" alt="Priv&#233;"></a>
	</td></tr>
</table>
</div>

<div id="bandeV">
		<img width="25" height="600" src="bande.jpg" border="0">
</div>
<div id="bandeH">
		<img width="1265" height="15" src="bandeh.JPG" border="0">
</div>
<div id="contenu" >
<br>
<center>
<?php
?>
<br><br>
<img src="bienvenu.gif" width="215" height="100"><br><H4>
<?php
?>
</center>
</div></div>

</body>
</html>

et le code css : fstyle.css
#conteneur
{width: 80%;  max-width: 1000px;  min-width: 700px; }

#menu
{position: absolute;  left: 0 px;  top: 115;}

#banières
{position: absolute;  left: 272px;  top: 0;}

#contact
{position: absolute;  left: 0 px;  top: 0px;}

#bandeV
{position: absolute;  left: 1240px;  top: 115px;}

#bandeH
{position: absolute;  left: 0px;  top: 700PX;}

#contenu
{width:975px;  height:600px;  margin-left: 275px;  margin-top: 115px;
background: url("background.jpg") white;  background-repeat: repeat;  background-attachment:  scroll;  overflow: auto;}


Merci d'avance cordialement Milicy
A voir également:

1 réponse

Utilisateur anonyme
14 nov. 2008 à 16:25
Bonsoir,

une idée c'est de faire un CSS par résolution d'écran.
0