28173 sujets

CSS et mise en forme, CSS3

Bonjour,
j'ai récupéré un code css pour faire une menu vertical qui permet d'afficher les sous-menus en cliquant sur les menus et masquer les autres sous-menus. J'ai fais un lien d'une pages toute simple sur la page contenant ce menu. Lorsque que j'arrive sur la page, il m'ouvre tous les sous-menus? Avez vous une idée pour me dépanner?
Merci par avance.
bonjour,

Je vais la faire genre "pas de bras" "pas de chocolat".

Pas de code, pas de liens, pas de réponse.

C'est ce que tu risque, en ne mettant pas plus de précision que cela pour permettre de comprendre ton problème.

Smiley cligne

Si tu insère du code attention de bien respecter les règles du forum que tu as surement lu et de le mettre dans les balises adéquates comme sheila.

Parce que sheila elle à des couettes.

Ok je sors Smiley lol
Modifié par knarf (22 Sep 2005 - 11:54)
Voici le code de ma page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Diaporama: la nature de Monistrol d'Allier</title>
<link href="../outils/styleoutils.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>


<style type="text/css">
/* CSS issu des tutoriels css.alsacreations.com */
<!-- 
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
left: 50%;
margin-left: -214px;
top: 130px;
}

#menu {
width:430px;
color: #ffffff;
}
#menu dt {
cursor: pointer;
margin: 10px;
height: 20px;
line-height: 20px;
text-align: left;
font-weight: bold;
background: #0094bf;
padding-left: 5px;
}

#menu li {
text-align: justify;
color: #000000;
padding: 5px;
}

#menu li a, #menu dt a {
color: #ffffff;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}

#menu dt a:hover {
background: #ffcc00;
color: #0094bf;
}

.mentions {
position: absolute;
top : 300px;
left : 10px;
color: #000;
background-color: #ddd;
}
-->
</style>




</head>

<body bgcolor="d7eef4" leftmargin="0" topmargin="0" rightmargin="0" onLoad="MM_preloadImages('../outils/images/fermer_over.gif')" >
<div class="pictofermer"><a href="javascript:window.close();" onMouseOver="MM_swapImage('Fermer','','../outils/images/fermer_over.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="../outils/images/fermer_out.gif" alt="Fermer la fen&ecirc;tre" name="Fermer" border="0" id="Fermer"></a></div>

<table width="445" height="452" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr> 
    <td height="133" valign="top" background="images/bandeau_news.gif"><img src="../images/logo.gif" width="144" height="73"></td>
  </tr>
  <tr> 
    <td height="350">&nbsp; </td>
  </tr>
</table>
<dl id="menu">
  <dt onClick="javascript:montre('smenu1');"><a href="#">COMPTE-RENDU 
              DE LA SEANCE DU CONSEIL MUNICIPAL DU 29 JUIN 2005</a></dt>
	  <dd id="smenu1"> 
		<ul>
		  <li><p>Pr&eacute;sents : Tous les conseillers en exercice</p>
      <p><strong><font color="#0094BF">Compte administratif 2004 : </font></strong>Le 
        Conseil adopte &agrave; l&#8217;unanimit&eacute; le compte administratif 
        2004 pr&eacute;sent&eacute; par le Maire, qui se r&eacute;sume ainsi pour 
        le budget principal :</p>
      <p><strong><font color="#0094BF">Compte de gestion 2004 :</font></strong> 
        Le Conseil adopte ensuite les comptes de gestion dress&eacute;s par le 
        receveur pour 2004.</p>
      <p><strong><font color="#0094BF">Budget Suppl&eacute;mentaire 2005
        :</font> </strong> Le budget pr&eacute;sent&eacute; est adopt&eacute; &agrave; 
        l'unanimit&eacute;. <br>
        Pour le budget principal, la section de fonctionnement s'&eacute;quilibre 
        &agrave; 116 987,75 &euro; dont 57 195,37 &euro; de pr&eacute;l&egrave;vement 
        suppl&eacute;mentaire pour l&#8217;investissement. La section d'investissement 
        s'&eacute;quilibre &agrave; 251 861,18 &euro;. <br>
        Ont &eacute;galement &eacute;t&eacute; adopt&eacute;s &agrave; l'unanimit&eacute; 
        les budgets de l'Eau, de l'Assainissement.<br>
        la R&eacute;gie de transports scolaires est d&eacute;sormais transf&eacute;r&eacute;e 
        &agrave; la Communaut&eacute; de Communes depuis le 1er janvier 2005. 
      </p>
      <p><strong><font color="#0094BF">Les principales d&eacute;penses suppl&eacute;mentaires 
        :</font></strong></p>
      <p>- <strong><em>Am&eacute;nagement bourg</em> :</strong> 30 395,37 &euro; 
        (Compl&eacute;ment de travaux sur 1&egrave;re tranche))</p>
      <p>-<strong> <em>Acquisition de mat&eacute;riels </em>:</strong> 1 300,00 
        &euro; (informatique mairie)</p>
      <p>- <strong><em>Divers b&acirc;timents</em> :</strong> 25 000,00 &euro; 
        (Biblioth&egrave;que, sanitaires salle communale et mise en conformit&eacute; 
        du G&icirc;te)</p>
      <p>- <strong><em>Service de l&#8217;Eau</em> :</strong> 78 200,00 &euro; 
        (Financement de la 2&egrave;me tranche des travaux de rectification de 
        la RD 589 entre les Gouttes et le Bois Noir et remplacement de la conduite 
        AEP)</p>
      <p><strong><font color="#0094BF">2&egrave;me tranche des travaux du bourg 
        :</font></strong> Monsieur le maire informe le Conseil que la 2&egrave;me 
        tranche des travaux d&#8217;am&eacute;nagement du bourg ne pourra pas 
        b&eacute;n&eacute;ficier des fonds europ&eacute;ens FEOGA (qui repr&eacute;sentaient 
        30 % du financement de la premi&egrave;re tranche). Afin de ne pas interrompre 
        les travaux, la tranche sera r&eacute;alis&eacute;e sur 2 exercices.</p>
      <p><strong><font color="#0094BF">Chapelle Sainte-Madeleine :</font> </strong>Sur 
        proposition de la Direction r&eacute;gionale des Affaires Culturelles, 
        le Conseil municipal &eacute;met un avis favorable &agrave; la demande 
        de classement de la chapelle &agrave; l&#8217;inventaire suppl&eacute;mentaire 
        des monuments historiques.</p>
      <p><strong><font color="#0094BF">Couverture ADSL :</font></strong> La commune 
        est desservie en Internet Haut D&eacute;bit (ADSL) depuis le d&eacute;but 
        du mois de mai. Cette couverture ne concerne pour le moment que le bourg, 
        puisque le central t&eacute;l&eacute;phonique de St-Privat n&#8217;assure 
        le haut d&eacute;bit que sur une distance d&#8217;environ 5 kilom&egrave;tres.</p>
      </li>
		  </ul>
	  </dd>
  <dt onClick="javascript:montre('smenu2');"><a href="#">VISITE 
              DU PREFET DE REGION</a></dt>
  <dd id="smenu2"> 
    <ul>
      <li>Par arr&ecirc;t&eacute; pr&eacute;fectoral du 27 juillet et suite aux 
        conditions hydrologiques actuelles, la zone &laquo; Allier amont &raquo; 
        est class&eacute;e au niveau rouge de l&#8217;alerte s&eacute;cheresse. 
        Tous les pr&eacute;l&egrave;vements d&#8217;eau en milieu naturel sont 
        strictement r&eacute;glement&eacute;s.<br>
        <strong>Il est d&eacute;sormais interdit :</strong><br>
        - de laver les v&eacute;hicules<br>
        - de remplir les piscines priv&eacute;es<br>
        - d&#8217;arroser les pelouses, les espaces verts et les massifs de fleurs, 
        entre 9 h et 19 h<br>
        - d&#8217;irriguer les prairies et les cultures entre 10 h et 19 heures<br>
        Ces mesures concernent tous types de pr&eacute;l&egrave;vement &agrave; 
        partir des r&eacute;seaux publics ou priv&eacute;s, des puits ou cours 
        d&#8217;eau&#8230;</li>
      </ul>
  </dd>
  <dt onClick="javascript:montre('smenu3');"><a href="#">SECHERESSE</a></dt>
  <dd id="smenu3"> 
    <ul>
      <li>Par arr&ecirc;t&eacute; pr&eacute;fectoral du 27 juillet et suite aux 
        conditions hydrologiques actuelles, la zone &laquo; Allier amont &raquo; 
        est class&eacute;e au niveau rouge de l&#8217;alerte s&eacute;cheresse. 
        Tous les pr&eacute;l&egrave;vements d&#8217;eau en milieu naturel sont 
        strictement r&eacute;glement&eacute;s.<br>
        <strong>Il est d&eacute;sormais interdit :</strong><br>
        - de laver les v&eacute;hicules<br>
        - de remplir les piscines priv&eacute;es<br>
        - d&#8217;arroser les pelouses, les espaces verts et les massifs de fleurs, 
        entre 9 h et 19 h<br>
        - d&#8217;irriguer les prairies et les cultures entre 10 h et 19 heures<br>
        Ces mesures concernent tous types de pr&eacute;l&egrave;vement &agrave; 
        partir des r&eacute;seaux publics ou priv&eacute;s, des puits ou cours 
        d&#8217;eau&#8230;</li>
      </ul>
  </dd>
</dl>
</body>
</html>
[/i][/i][/i][/i][/i][/i]
rebonjour tt le monde.
J'ai un soucis avec ce menu. Il se trouve que sur une de mes pages j'ai un formulaire et le ss-menu passe audessous des zones du formulaire; Avez-vous une solution ?
Merci Smiley bawling
Salut,

prends conscience qu'un code a ralonge mal formaté (italic : illisible) inserré dans le post sans lien vers une page en ligne en freine plus d'un a la lecture, c'est mon cas par exemple.

Reprend ta page, simplifie là pour poster un code plus leger.

Sinon, copie la page du menu alsa. chez toi, elle fonctionnera, puis copie colle tes elements perso dans le squelette html un par un en verifiant a chaque insertion que tout "s'envole pas".

Vas y doucement.

Et ya des chances que tu resolves ton probleme toute seule.

Bon courage.
Modifié par Hum (24 Jun 2006 - 12:47)