28173 sujets

CSS et mise en forme, CSS3

[resolu]Probleme alignement liste sous IE

Bonjour,

apres plusieurs recherches vaines sur ce forum et dans la FAQ, je me permet de soliciter votre aide.

Sous IE les elements du menu se mettent a droite alors ke je voudrais qu'il revienne a la ligne gentillement comme sous Firefox, j'ai essayer plein de truc sans succes. (clear:both , display:block)

http://fardeen.info/westbrome//index.php?page=spa

Si quelque'un pouvait me debloquer ce serait super cool Smiley smile

Merci

Ci-dessous le code CSS du menu en question (le jaune) , le css applique a l 'element qui pose probleme est #menu_vert li.activeparent h3>


#menu_vert {

float : left ;

padding: 0;

margin : 0;

padding-left : 20px;



width: 150px;



  }



#menu_vert ul {

font-family: Times, "Times New Roman", sans-serif;

  /*width: 150px; */ /* Width of Menu Items */

padding: 0;

margin : 0;

  }



#menu_vert li {

  letter-spacing : 1px ; 

  list-style: none;

  }



#menu_vert li a {

  display: block;

  text-decoration: none;

  padding: 5px 0px 5px 5px;

  color: #f3ad3b;

border-left: 2px solid #F3AD3B;

  }



/* Fix IE. Hide from IE Mac \*/

* html #menu_vert li { float: left; height: 1%; }

* html #menu_vert li a { height: 1%; }

/* End */



    div#menu_vert ul ul li a, 

    div#menu_vert ul ul li a:link, 

    div#menu_vert ul ul li a:visited  {



    }

    div#menu_vert ul ul  {

      border-right: none;

      border-top: none;



    }



    div#menu_vert ul ul ul li a, 

    div#menu_vert ul ul ul li a:link, 

    div#menu_vert ul ul ul li a:visited  {

        padding-left: 40px;

    }

    div#menu_vert ul ul ul  {

      border-bottom: none;

    }

#menu_vert li ul li a { padding: 5px 5px; } /* Sub Menu Styles */



/* fixed image flicker by adding .cssmenu-vertical ul */



#menu_vert li a:hover {

	padding: 5px 0px 5px 10px;

/*border-left: 0px ;*/





}



.current

{

color : #95cce0;

}

/*PARENT*/

#menu_vert li.activeparent h3{

  font-weight : bold;

display: block;

clear : both ;



  /*color : #F3AD3B;*/

  /*list-style: square;*/

/*color : #95cce0;*/

/*padding: 5px 0px 5px 10px;*/



 /*background-image: url(uploads/images/site/arrow.gif);

background-repeat: no-repeat;

background-position: 50% .4em;*/

}



#menu_vert li.active01 h3 {



display: block;

clear : both ;



/*

  text-decoration: none;

  padding: 5px 0px 5px 5px;

color : #95cce0;

font-size : 1em ;

border-left: 2px solid #95cce0;

margin: 0;

*/

  }





#menu_vert li.active02 h3

{

  display: block;

  text-decoration: none;

  padding: 5px 0px 5px 5px;

color : #95cce0;

font-size : 1em ;

border-left: 2px solid #95cce0;

margin: 0;

}



#menu_vert li.active03 h3

{

  display: block;

  padding: 3px 5px 3px 40px;

  border-bottom: none;

  font-size: 90%;

  font-weight: bold;

  color: #18507C;

  margin: 0;

}



li.sectionheader {

  margin: 0;

  margin-right: -1px;

 }



li.sectionheader h3 {

   margin: 0;

   padding: 1em 10px 0.5em 10px;

   border: none;

   background-color: #fff;

  border-bottom: 1px solid #006699;

  z-index: 90;

}



li.separator {

   height: 1px;

   padding: 0.5em 0;

   margin: 0;

   width: 100%;

   border-bottom: 1px dotted black;

	}

Modifié par -FG- (30 Mar 2006 - 22:07)
Salut,

Je te propose d'essayer de supprimer toute cette partie qui a du être fait pour corriger un bug d'IE

/* Fix IE. Hide from IE Mac \*/
* html #menu_vert li { float: left; height: 1%; }
* html #menu_vert li a { height: 1%; }
/* End */

et pour corriger ce bug, d'appliquer un display:inline : 
#menu_vert li {
  display: inline;
  letter-spacing : 1px ; 
  list-style: none;
  }

Sinon c'est assez surprenant. On dirait que ton code CSS a été fait pour un autre menu (un menu à plusieurs niveaux, de type dépliant/dynamique par exemple) car une très grande partie du CSS ne sert à rien pour le moment...

Bonne soirée
Modifié par Alan (30 Mar 2006 - 21:17)
Ca marche merci !!

Oui il y a beaucoup de CSS inutile car j'utilise CMS Made Simple et tous les CSS sont inclus dans la base de donnees, le CSS global etant diviser en plusieurs parties, mais faudra que je fasse le menage.

Merci encore Smiley smile
Sujet clos
Aller à