18041 sujets

Questions générales et questions de débutants

[RESOLU] Insertion Puce

Hello.

J'essaie d'insérer une puce dans mon menu, sans succès...
Il s'agit d'un menu que j'ai récuppéré..
C'est assez simple, mais pas moyen d'y arriver...

Code HTML
<div id="box-navmenu" class="box">
  <div class="interior">
	<ul><li><a href="home.html"><span>Home</span></a></li>
		<li><a href="about.html"><span>About</span></a></li>
		<li><a href="ads.html"><span>Ads</span></a></li>
		<li><a href="submit.html"><span>Submit a Site</span></a></li>
    </ul></div></div>


Css

div.box{
	background:#1d1d23 none;
	font-family:Verdana, sans-serif;
	font-size:10px;
	border-color:#30303b;
	line-height:15px
}
div.box div.interior ul li a:hover{background-color:#131317;text-decoration:none;}
div#box-navmenu{width:200px;padding:7px 10px;}
div#box-navmenu div.interior{border:none;}
div#box-navmenu ul{
	display:block;
	margin:0;
	padding:0;
	list-style-type: none;
	}
div#box-navmenu ul li{
	display:block;
	margin:0;
	padding:0;
}
div#box-navmenu ul li a,div#box-navmenu ul li a:visited{display:block;border-top:1px solid #30303b;border-bottom:1px solid #000;text-decoration:none;text-transform:uppercase;outline:none;margin:0;padding:2px 0;}
div#box-navmenu ul li a span{
	display:block;
	margin:0;
	padding:6px 0 6px 30px;
}
a:link,a:visited,a:hover{color:#5f7c9c;}
div.box div.interior ul li,div.box div.interior ul li a,div.box div.interior ul li a:visited{
	color:#999;
}


Une idée?
Modifié par FranZz (17 Dec 2008 - 08:04)
Hello,

Ben tu as la ligne suivant pour ton ul dans la feuille de style, ce qui a pour effet de ne pas afficher de puce...


list-style-type: none;
Helo

J'ai supprimé le none, mais ça ne fonctionne pas... C'est assez particulier... Même si je rajoute une image c'est pareil Smiley confus
Modifié par FranZz (16 Dec 2008 - 13:42)
Si j'enlève display: block; dans "div#box-navmenu ul li" , je vois bien la puce Smiley cligne
Modifié par audrasjb (16 Dec 2008 - 14:48)
Hello,

Pour le fun, javais 2 min devant moi :

Placement de la puce en background (positionnement à modifier suivant l'envie et le besoin) + un peu de "ménage"...
Police, taille de police etc... sont également à adapter suivant le besoin.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Menu</title>
	<style type="text/css" media="screen" >
		html {
			font-size:100%;
		}
		body {
			font-family:Verdana,sans-serif;
			font-size:.6em;
			background:#282831;
		}
		ul,li {
			margin:0;
			padding:0;
		}
		div#box-nav{
			line-height:1.5;
			width:200px;
			background:#1D1D23;
			border-color:#30303B;
			padding:7px 10px;
		}
		ul.nav li {
			list-style:none;
		}	
		ul.nav li a, ul.nav li a:visited {
			border-bottom:1px solid #000000;
			border-top:1px solid #30303B;
			display:block;
			margin:0;
			padding:2px 0;
			text-decoration:none;
			text-transform:uppercase;
			color:#999999;
			background: url(essai.gif) no-repeat 5px 50%;
		}
		ul.nav li a:hover,ul.nav li a:focus {
			text-decoration:none;
			background:#131317 url(essai.gif) no-repeat 0 50%;
		}
		ul.nav li a span {
			display:block;
			margin:0;
			padding:6px 0 6px 40px;
		}
	</style>
</head>
	<body>
		<div id="box-nav">
			<ul class="nav">
				<li><a href="home.html"><span>Home</span></a></li>
				<li><a href="about.html"><span>Services</span></a></li>
				<li><a href="ads.html"><span>Réalisations</span></a></li>
				<li><a href="submit.html"><span>Envoi CV</span></a></li>
			</ul>
		</div>
	</body>
</html>

La "récup" n'empêche pas de jouer... Smiley cligne
Voili, voilou...

Cdt,
Sylvain
Hello 6l20!

Oula, juste pour le fun !!!

T'as lu dans mes pensées ! Smiley jap

Bien vu aussi audrasjb!

Smiley biggol Smiley biggol
Sujet clos
Aller à