Sujet Précédent Sujet Suivant

Liste <li> qui agrandit le tableau

Sinistrus Messages postés 1017 Date d'inscription mercredi 12 décembre 2007 Statut Membre Dernière intervention 6 juin 2023 - 4 déc. 2014 à 14:58
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 - 4 déc. 2014 à 19:30
Bonjour,

J'ai un petit soucis avec mon CSS et sollicite votre aide.

J'ai ce bout de code CSS : 
#menu					{width: 183px; height: 40px; list-style-type: none; margin: 0; padding: 0; border: 0; top: 0; left: 0;}
#menu li				{float: left; width: 183px; margin: 0; padding: 0; border: 0;}
#menu li a:link,
#menu li a:visited		{display: block; margin: 0;}
#menu li a:hover 		{background-color: #EEE;}
#menu li a:active 		{background-color: #EEE;}
#menu .sous_menu		{display: none; list-style-type: none; margin: 0; padding: 0; border: 0; }
#menu .sous_menu li		{float: none; margin: 0; padding: 0; border: 0; width: 183px;}
#menu .sous_menu li a:link,
#menu .sous_menu li a:visited {display: block; margin: 0; border: 0;}
#menu li:hover > .sous_menu { display: block; }
.Cont					{width:183px; height:40px; padding:8px 10px 0 10px; background: #EEE; border: 1px solid #CCC; list-style-type: none; cursor:pointer;}
.Titre					{float:left; color:#105289;}
.fleche					{background:url(fleche_bas.png) no-repeat; float:right; margin:10px 10px 0 0; width:10px; height:5px;}
.SousMenu				{width:183px; height:31px; padding:2px 10px 0 10px; background: #FFF; border: 1px solid #CCC; border-top:hidden; list-style-type: none; color:#105289; font-size: 16px; cursor:pointer;}
.SousMenu:hover			{width:183px; height:31px; padding:2px 10px 0 10px; background: #EEE; border: 1px solid #CCC; border-top:hidden; list-style-type: none; color:#AA0000; font-size: 16px;}
.SousTitre				{float:left; font-size: 16px;}
.Cadre					{padding:0; width:183px; height:40px;}
.Drapeau				{padding:2px 10px 0 0; float:left; width:33px; height:25px;}
.Pays					{padding:0 10px 5px 43px;}
.Desc					{padding:0 10px 0 43px; color:#999; font-size:12px;}

et ce bout de code html : 
<table width="800" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="379" bgcolor="#009900"> </td>
    <td width="421" bgcolor="#D6D6D6"> </td>
  </tr>
  <tr>
    <td bgcolor="#FFCC33"> </td>
    <td bgcolor="#3399CC">
    
<ul id="menu">
<li>
<div class="Cont"><div class="Titre"><a href="#">Sélectionner</a></div><div class="fleche"></div></div>
<ul class="sous_menu">
<li><a href="#"><div class="SousMenu"><div class="Cadre"><div class="Drapeau"><img src="cote.png" /></div><div class="Pays">Liban</div></div></div></a></li>
<li><a href="#"><div class="SousMenu"><div class="Cadre"><div class="Drapeau"><img src="liban.png" /></div><div class="Pays">Liban</div></div></div></a></li>
<li><a href="#"><div class="SousMenu"><div class="Cadre"><div class="Drapeau"><img src="france.png" /></div><div class="Pays">Liban</div></div></div></a></li>
</ul>
</li>
</ul>
    
    </td>
  </tr>
  <tr>
    <td bgcolor="#33CCCC"> </td>
    <td bgcolor="#6633FF"> </td>
  </tr>
</table>


Lorsque je survol ma liste, la sous catégorie agrandit le tableau dans lequel mon script est.

J'ai essayé 
overflow:hidden
mais rien y fait.

Avez-vous une autre solution svp ?

1 réponse

Réponse 1 / 1
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 344
4 déc. 2014 à 19:30
Bonjour,

Essayes de modifier ceci : 
#menu					{ position: relative;width: 183px; height: 40px;  margin: 0; padding: 0; border: 0; top: 0; left: 0;}
#menu li				{display: inline-block;position:relative;list-style-type: none; width: 183px; margin: 0; padding: 0; border: 0;}

0

Discussions similaires

parcourir une liste en java
imenmannou -
DARKSIDIOUS -

2 réponses
Listing des marques et modéle de voiture
tibine974 -
Nidalbae -

41 réponses
Turbo C++
cs_jrod -
cmarsc -

1 réponse
tableau de nombre décimal vers tableau de nomber binaire
mkhadi -
mkhadi -

2 réponses
Etablir toutes les combinaisons possibles du Lotto
KBNchapal -
Mikaels35 -

6 réponses
Rejoignez-nous