Discussion :

[arnaud_verlaine]

Bonjour !
Je viens de commence un site PHP/CSS
Site web
J'ai cependant quelques soucis :

1) Pourquoi les liens fonctionnent impecc sous FF et pas sous IE ? je ne vois pas du tout là !!
Son code

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
 
<ul id=\"menu\">
 
	<li>&nbsp;</li>
	<li><a href=\"#\">QUI SOMMES NOUS ?</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">OBJECTIFS</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">MOYENS</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">AGENDA</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">ANNONCES</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">ZONE MEMBRES</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">COMMENT ADHERER</a></li>
	<li><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div></li>
	<li><a href=\"#\">CONTACT</a></li>
 
</ul>";

et 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
 
/* MENU */ 
#menu{
width:200px;
margin-left:10px;
padding-left:0px;
margin-top: 0px;
padding: 0px;
padding-bottom: 20px;
background-color:#DBDBDB;
/* Ecriture */
font-family:Geneva, Verdana, Helvetica, sans-serif;
font-size:10px;
text-decoration:none;
font-weight:bold;
color:#333333;
list-style-type: none; /* pas de puces */
margin-bottom: 0;
}
 
#menu li a { /* les "a" des "li" dans "#menu" */
display:block;
margin: 0px; /* espace entre les menus */
text-align:center;
height:20px;
color: #000;
text-decoration: none;
}
#menu li a:hover { /* les "a" des "li" dans "#menu" */
background-color:#666666;
color:#ffffff;
}

2) je n'arrive pas à aligner mes textes verticalement (dans les <li> du menu) et en dessous dans mon <div>) Horizontalement, ça fonctionne impecc avec text-align mais pas verticalement. Je peux mettre vertical-align à middel, top etc , ça reste toujours la même chose.. une idée ?

3) Comment faire pour disposer mes blocs ? Je pense notamment :
a) au bloc blanc du milieu : Là où je vais mettre mon texte (je l'ai positionné de manière statique verticalement avec une valeur négative - le plus simple serait de lui mettre la même coordonée verticale que le menu de gauche ! mais là je cale...

b) Quand mon corps va grandir, je voudrais que mon menu de gauche aille toujours "toucher" la barre grise en dessous - Mais comment le fair de manière dynamique sans entrer de données?

Je viens de faire des recherches et aussi la FAQ notamment pour le texte mais je tourne en rond j'ai l'impression...
Quelqu'un a une corde à me jeter ?
D'avance, Merci pour votre coup de pouce

[arnaud_verlaine]

Pour le texte, j'ai trouvé, il suffit d'ajouter la hauteur de la ligne

Code :

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

1
2
 
line-height: 20px;

Ca, c'est fait

Pour le positionnement de mes blocs et le problème de mes liens, quelqu'un a une idée?

[trotters213]

je suppose que ce que tu nous montres se trouve dans un echo sinon tu peux d'ores et déjà remplacer tous les \" par "
Ensuite tu utilises mal les div, ce sont des balises blocs, pas inline donc il faut que tu les utilises sur un ensemble d'élément et après tu gères tes marges grâce à la div et non pas en mettant un élément de liste vide entre 2 éléments de listes :

Code :

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

1
2
3
4
5
6
7
8
9
10
<div align=center><img src=\"LigneMenu.gif\" border=\"0\" /><ul id=\"menu\">
	<li><a href=\"#\">QUI SOMMES NOUS ?</a></li>
	<li><a href=\"#\">OBJECTIFS</a></li>
	<li><a href=\"#\">MOYENS</a></li>
	<li><a href=\"#\">AGENDA</a></li>
	<li><a href=\"#\">ANNONCES</a></li>
	<li><a href=\"#\">ZONE MEMBRES</a></li>
	<li><a href=\"#\">COMMENT ADHERER</a></li>
	<li><a href=\"#\">CONTACT</a></li>
</ul><div align=center><img src=\"LigneMenu.gif\" border=\"0\" /></div>

pour positionner tes blocs tu peux utiliser 3 div : un pour celui de gauche, un pour le milieu et le dernier pour la droite. Tu leur donnes une taille en % pour avoir un redimensionnement dynamique et tu leur donnes tous la valeur float:left et ça devrait être bon.

[arnaud_verlaine]

impecc ça marche Merci !