28172 sujets

CSS et mise en forme, CSS3

[Résolu]Problème de CSS

Bonjour à tous,
je souhaiterai mettre un ligne horizontale au dessus de chaques items de mon menu déroulant mais je n'arrive pas à le faire en css.
est-ce que quelqu'un à une idée sur la façon de procédé?


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
html {
	font-size: 100%;
}
body {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.625em;
	line-height:1.20em;
}
#treemenu1 ol{
	width:181px;
	height:auto;
}
#treemenu1 .titremenu{
	color:#FF0000;
	border-top: dotted 1px #999999;
}
#treemenu1 .titresousmenu{
	margin-top: 5px;
	padding: 0;
	color:#009933;
}
#treemenu1 .sousmenu{
	color:#FFCC00;
}
-->
</style>
</head>

<body>
<!--debut de menu-->
<ol id="treemenu1">
 <li>
  ITEM 1
  <ul class="sousmenu">
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">castor</a></li>
   <li><a href="#">aligator</a></li>
   <li><a href="#">musclor</a></li>
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">castor</a></li>
   <li><a href="#">aligator</a></li>
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">musclor</a></li>
  </ul>
 </li>
 <li>
  ITEM 2
    <ul class="sousmenu">
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">castor</a></li>
   <li><a href="#">aligator</a></li>
   <li><a href="#">musclor</a></li>
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">castor</a></li>
   <li><a href="#">aligator</a></li>
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">musclor</a></li>
  </ul>
 </li>
  <li>
  ITEM 3
    <ul class="sousmenu">
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">castor</a></li>
   <li><a href="#">aligator</a></li>
   <li><a href="#">musclor</a></li>
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">castor</a></li>
   <li><a href="#">aligator</a></li>
  <li class="titresousmenu">Agro-alimentaire :</li>
   <li><a href="#">musclor</a></li>
  </ul>
 </li>
</ol>
<!--fin de menu-->
</body>
</html>
Smiley lol Smiley lol
Modifié par okwan (30 Jun 2008 - 16:15)
Salut okwan,

tout d'abord la déclaration #treemenu1 ol { ... } ne cible aucun élément car ol n'est pas un enfant de #treemenu1 : à remplacer par #treemenu1 { ... } Smiley cligne .

Sinon, je ne suis pas sûr que cela corresponde bien à ta demande mais tu pourrais essayer :
#treemenu1 > li {
	border-top: #660099 1px solid;
	margin-top: 5px;
	padding-top: 2px;
}
(cela ne fonctionnera pas avec IE6 qui ne reconnaît pas ce sélecteur Smiley murf )

A+


Edit: D'autre part, comme tu es dans le salon CSS, tu dois te douter que la grande majorité des sujets ici (voire tous) traitent de "Problème de CSS".

Ton sujet va donc malheureusement vite se perdre dans la masse, tout simplement parce que tu ne donnes pas assez de précision dans ton titre Smiley decu
Modifié par Heyoan (27 Jun 2008 - 11:08)
Sujet clos
Aller à