28172 sujets

CSS et mise en forme, CSS3

Voilà, j'ai créé un simple menu avec un float:right pour le mettre à droite de mon logo mais sous IE6 et I7, j'ai des problèmes d'affichage...

Problème:
upload/15866-IE6-7.png

CSS:

h1 {
background: url(../img/simonsouris.jpg) no-repeat;
float: left;
height: 60px;
width: 176px;
}

#content {
margin: auto;
position: relative;
width: 900px;
}

#head {
margin-top: 15px;
}

#menu {
float: right;
margin: 40px 0 0;
padding-right: 25px;
width: 500px;
}


HTML:

<div id="content">
		
		<div id="head">
			<h1><a class="home" href="index.html" title="Revenir &agrave; l'accueil"><!-- Logo dans le code css --></a></h1>
		</div>
		
		<div id="menu">
			<ul id="navlist">
			<li><a href="annonces.html" title="Devenez mod&egrave;le ou assistant">Annonces</a></li>
			<li class="current"><a href="a-propos.html" title="En savoir plus sur lui">A propos</a></li>
			<li><a href="contact.html" title="Contactez-le">Contact</a></li>
			<li><a href="offres.html" title="Diff&eacute;rentes offres en photograhie">Offres</a></li>
			<li><a href="photographie.html" title="Voir ses photos">Photographie</a></li>
			</ul>
		</div>

</div>

Modifié par simon-s (05 Apr 2009 - 20:13)
Salut,

je ne vois pas bien le rapport entre le code et l'image mais quelques remarques :
* si une image contient une information (c'est le cas pour le H1) elle ne doit pas être dans le code css (qui peut être désactivé/indisponible) mais directement dans le code html en utilisant l'élément IMG (et en passant il faut également renseigner l'attribut alt au cas où les images seraient désactivées/indisponibles).
* d'après ton image tu utilises un élément SELECT en association avec du JavaScript et sans INPUT de type submit : c'est une façon de faire inaccessible (cf. Comment bien coder en Javascript).
* je ne sais pas si cela répond à ta question mais un élément en float doit être placé en premier dans le flux html (cf. le Guide de survie du positionnement CSS).
Je vais tenter de remédier à tout ça. Merci beaucoup en tout cas.

Seul problème, c'est pour le JS, je n'y connais rien.. J'ai pris un code sur un site pour avoir ce footer...