Discussion :

[yooyoo]

Bonjour, je cherche depuis un moment comment faire des liens en images, mais que ses images aient des coins arrondi, avec une largeur extensible.

J'avais trouver ceci :
http://www.developpez.net/forums/d65...oins-arrondis/

mais sa ne marche pas pour moi.

mon menu est horizontal, dans une div #menu :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
#menu {
	width: 100%;
	height: auto;
	background-color: #55bbff;
	text-align: center;
	padding-top : 5px;
	padding-bottom: 5px;
}

actuellements, mes liens dans mon menu sont de ce style <a href="#">mon lien</a>

sa ne me dérange pas de changer au cas ou.

Merci pour votre aide, et bonne journée

[nsanabi]

pour cela il te suffisait de passer par un moteur de recherche :

voila 1 premier lien puis un autre et y'en a plus sur la toile meme en video

[yooyoo]

merci je vais voir ca

[yooyoo]

Bonjour, çà marche mais a l'affichage j'ai un souci, au lieu que mes bouton soit dans la div que j'ai cité plus haut, elle sont dessous :/

[nsanabi]

peut tu mettre le morceau de code html et css concerné?

[yooyoo]

partie du code html :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
		<div id="page">
			<div id="barre_haut">
				<div class="element_barre">
					<img src="./images/rss1.png" />texte un, <img src="./images/rss2.png" />texte deux, <img src="./images/rss3.png" />texte trois <!-- image, et lien -->
				</div>
			</div>
			<div id="header">
				<img src="./images/game_script.jpg" height="90px" width="225px" alt="Game-Script" title="Game-Script" /> <img src="./images/pub_barre.jpg" height="90px" width="728px" />
			</div>
			<div id="barre_menu">
			<a class="button" href="#"><span>1er lien</span></a> <a class="button" href="#"><span>2eme lien</span></a> <a class="button" href="#"><span>3eme lien</span></a>
			</div>
			<div id="barre_sous_menu"></div>
			<div id="contenu">

avec son css :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
body {
	margin: 0;
	background-color: #ddeeff;
}
 
#page {
 
}
 
#barre_haut {
	text-align: center;
	width: auto;
	height: auto;
	background-color: #000000;
	color: #FFFFFF;
}
 
#barre_haut img {
	padding-left: 20px;
	vertical-align: middle;
}
 
#header {
	width: 100%;
	height: 120px;
	background-color: #0077cc;
}
 
#header img {
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 10px;
}
 
#barre_menu {
	width: 100%;
	height: auto;
	background-color: #55bbff;
	text-align: center;
	padding-top : 5px;
	padding-bottom: 5px;
}
 
#barre_sous_menu {
	width: 100%;
	height: 4px;
	background-color: #000000;
}