28220 sujets

CSS et mise en forme, CSS3

Debutant css besoin de conseils

Bonjour à tous, je ne me servai du css jusqu'a présent juste pour améliorer le rendu de mon texte dans mes pages html/php, j'ai toujours travaillé avec des tableaux jusqu'à présent, je me rend bien compte de l'interet du css et décide de m'y mettre pour de bon.
Le site que je réalise actuellement était donc au départ destiné a etre construit en tableau, j'ai tout repris en css.
Je me suis aidé du tutoriel sur ce site "creation css xhtml en cinq étapes..."
mais je me retrouve confronté à certains problemes Smiley decu

le site : http://www.neskoncept.com/bassenji/index2.htm

le menu est composé d'images, il se cale bien sous mozilla mais est décalé sous explorer Smiley decu


pour ce menu j'ai utilisé le code suivant dans ma page : 

<ul id="menu">

    <li><a href="etape1.html"><img src="img/menu/menu_r1_c1.gif" width="117" height="43" border="0" /></a></li>
    <li><a href="etape2.html"><img src="img/menu/menu_r1_c2.gif" width="108" height="43" border="0" /></a></li>
    <li><a href="etape3.html"><img src="img/menu/menu_r1_c3.gif" width="114" height="43" border="0" /></a></li>
    <li><a href="etape4.html"><img src="img/menu/menu_r1_c4.gif" width="109" height="43" border="0" /></a></li>
    <li><a href="etape5.html"><img src="img/menu/menu_r1_c5.gif" width="88" height="43" border="0" /></a></li>
	<li><a href="etape5.html"><img src="img/menu/menu_r1_c6.gif" width="105" height="43" border="0" /></a></li>
	<li><a href="etape5.html"><img src="img/menu/menu_r1_c7.gif" width="159" height="43" border="0" /></a></li>
  
</ul>


Le css pour le menu : 


ul#menu
{
	height: 43px ;
	margin: 0 ;
	padding: 0 ;
	list-style-type: none ;
	border: 0 ;
	left: 0px ;
}

ul#menu li
{
	float: left ;
}/* On rend les li en flottant pour pouvoir les afficher horizontalement, on cache les puces, et on centre le texte */

ul#menu li a
{
	display: block ;
	text-decoration: none ;
	border: 0;
}



Est ce adapté pour un menu composé d'image ? j'avou que je suis un peu perdu ...

merci à vous


edit : dsl pour cet oubli Smiley confused
Modifié par nesk (13 May 2005 - 14:20)
Bonjour et bienvenue nesk Smiley smile

Visiblement, tu n'as pas pris connaissance des règles du forum

Merci de bien vouloir "Editer" ton message pour placer tes codes dans la balise "Code" appropriée, ce qui rend la lecture des échanges plus facile Smiley cligne
Salut

Ma réponse vaut ce qu'elle vaut étant moi meme debutant Smiley smile .

La taille de ton conteneur et de 800px, la taille totale des images de ton menu et de 800 px également.
En enlevant 1 px a la premiere et derniere image, ton menu s'aligne correctement sous Internet explorer.


<li><a href="etape1.html"><img src="img/menu/menu_r1_c1.gif" width="11[b]6[/b]" height="43" border="0" /></a></li>
<li><a href="etape5.html"><img src="img/menu/menu_r1_c7.gif" width="15[b]8[/b]" height="43" border="0" /></a></li>
Revers de la médaille, sous firefox on retrouve un décalage de 2 px a droite du menu Smiley ohwell .

Enfin c'est peut etre un début d'idée a creuser.

Si je ne me trompe pas, tu n'est pas obligé de preciser 

<li><a ..... [b]border="0"[/b] /></a></li>
étant donné que ce paramètre est deja précisé dans ta feuille de style. (a confirmé car comme je l'ai dit je suis moi même débutant Smiley cligne ).

En esperant t'avoir un peu aidé.
merci de m'avoir aidé, pour ce qui est du border:0 je l'ai spécifié dans le html, car il ne le prenait pas en compte sinon Smiley decu

en tout cas merci pour ton aide
ok je suis sur le point d'y arriver, le probleme disparait losrque je retire la bordure de contour de mon conteneur, comme ci cette derniere était intérieur et qu'elle prenait un pixel sur les 800 résérvés à mon menu.
En tout cas merci à vous je vais fouiller le forum et essayer de comprendre .
Par contre, ça serait bien d'indiquer l'attribut alt de tes images.
Avec pour contenu, ce qui est écrit sur l'image.
Sujet clos
Aller à