28220 sujets

CSS et mise en forme, CSS3

[Résolu] Pbl letter-spacing

Bonjour à tous,

Savez-vous si un bug existe sur la propriété letter-spacing ?

Voir ma page ici: http://www.princessedunjour.com/nouveau3.htm

- sous ie, le letter spacing du menu s'affiche bien (qq pixels entre chaque lettre
- sous ff, le letter spacing n'est pas du toutpris en compte


body {
margin: 0;
text-align: center;
background-color: #EBEBEB;
}
img {
border-width: 0;
border-style: none;
}
#page {
margin-left: auto;
margin-right: auto;
width: 900px;
text-align: left;
background-color: #FFFFFF;
}
h1 { 
font-family: Arial, Times, serif;
letter-spacing: 0.3em;
font-size: 65%;
color: #990099;
margin-left: 25px;
}
ul#menu_haut {
margin-top: 10px;
margin-bottom:8px;
padding: 5px;
letter-spacing: 0.2em;
list-style-type: none;
font-family: Arial, Times, serif;
font-size: 60%;
margin: 0 10px 15px 10px;
text-align: left;
}
#menu_haut li {
display: inline;
margin: 0 15px;
}
#menu_haut a {
color: #999999;
text-decoration: none;
text-align: left;
}
#menu_haut a:hover {
color: #000000;
}
#photo1 {
margin-left: 82px;
margin-top: 25px;
}
#photo2 {
margin-left: 30px;
}
#photo3 {
margin-left: 30px;
}
p {
font-family: Arial, Times, serif;
letter-spacing: 0.1em;
font-size: 75%;
color: #999999;
margin-left: 25px;
}
ul#menu_bas {
margin-top: 10px;
margin-bottom:8px;
padding: 5px;
letter-spacing: 0.2em;
list-style-type: none;
font-family: Arial, Times, serif;
font-size: 60%;
margin: 0 10px 15px 400px;
}
#menu_bas li {
display: inline;
margin: 0 15px;
}
#menu_bas a {
color: #999999;
text-decoration: none;
}
#menu_bas a:hover {
color: #000000;
}
.footer {
font-size: 55%;
text-align: center;
}
.partenaires {
font-size: 55%;
text-align: center;
}
.textecentre {
margin-left: 25px;
font-family: Arial, Times, serif;
letter-spacing: 0.1em;
font-size: 75%;
color: #990099;
}




<body>
     <div id="page">
        <h1 id="titre">
        <a href="http://www.princessedunjour.com">
        <img src="logo222.gif" alt="Princesse d'un Jour" style="vertical-align: middle; margin-right: 50px;" /></a>
        BIJOUX ET ACCESSOIRES POUR LE MARIAGE
        </h1>
		
		<ul id="menu_haut">
        <li><a id="menu1" title="Colliers mariage" href="accessoires-colliers-mariage.htm">ACCUEIL</a></li>

		<li><a id="menu2" title="Bracelets mariage" href="accessoires-mariage-bracelets.htm">COLLECTIONS</a></li>
		<li><a id="menu3" title="Boucles d'oreilles mariage" href="accessoires-boucles-doreilles.htm">DESIGN</a></li>
		<li><a id="menu4" title="Pics à cheveux mariage" href="accessoires-mariage-pics-a-cheveux">POINTS DE VENTE</a></li>
		<li><a id="menu5" title="Tiares mariage" href="accessoires-mariage-tiares.htm">A PROPOS</a></li>
		<li><a id="menu6" title="Pics à cheveux mariage" href="accessoires-mariage-pics-a-cheveux">CONTACT</a></li>
        <li><a id="menu7" title="Princesse d'un Jour" href="index_eng.htm">ESPACE PRO</a></li>

        </ul> 
<a href="http://www.princessedunjour.com">
<img src="/Cameliatest.jpg" id="photo1" alt="Princesse d'un Jour" /></a>
<a href="http://www.princessedunjour.com">
<img src="/Orchideetest.jpg" id="photo2" alt="Princesse d'un Jour" /></a>
<a href="http://www.princessedunjour.com">
<img src="/Cristaltest.jpg" id="photo3" alt="Princesse d'un Jour" /></a>
    <h2 class="textecentre">Venez découvrir la douceur et la délicatesse des trésors Princesse d’un Jour entièrement confectionnés à la main et sur mesure. Des parures créées spécialement pour la mariée.</h2>
	<p>Colliers, bracelets, pics à cheveux, boucles d'oreilles et tiares. Toutes nos parures pour la mariée sont garnies de cristal Swarovski et des fines perles de bohème. Découvrez nos bijoux pour le mariage</p>    
	<ul id="menu_bas">
        <li><a id="menu1" title="Colliers mariage" href="accessoires-colliers-mariage.htm">CATALOGUE</a></li>

		<li><a id="menu2" title="Bracelets mariage" href="accessoires-mariage-bracelets.htm">PRESSE</a></li>
		<li><a id="menu3" title="Boucles d'oreilles mariage" href="accessoires-boucles-doreilles.htm">NET PARTENAIRES</a></li>
        </ul>
		
		        <p class="footer"> Copyright © 2005 Princesse d'un Jour. Tous droits réservés. Princesse d'un Jour® est une marque déposée.</p>		 
                <p class="partenaires">Sites Partenaires : Organisation de mariage en provence avec Noces-Provencales.com | NotreMariage.net</p>
</div>


bizarre non ?

Merci et a+
Modifié par pp51 (10 Feb 2006 - 16:37)
Ah bon, j'ai aussi ff 1.5 et pourtant j'ai l'impression qu'il n'y a aucun ecart entre les lettres sur le menu du haut.

sous ie 6.0 je le "vois" nettement.

Quelqu'un peut faire un test pour me dire si j'ai vraiment besoin de lunettes Smiley confus
bon je viens de regarder plus minutieusement. Disons qu'il y'a tout de même un écart mais c'est pas choquant.
La taille d'affichage du texte dans ton FF est bien mis sur "normal" (Ctrl+0) ?
oui l'affichage sous ff est normal.

Ce n'est pas tant l'écart qui me gène, c'est simplement que mon menu est moins large sous ff que sous ie, alors que je souhaiterais qu'il s'affiche comme sur ie pour mieux occupé l'espace.

As tu une idée ?

Merci
Sujet clos
Aller à