Outils de recherche et référencement
Forum dédié au moteur de recherche et aux techniques d'optimisation par #taggle
Vous n'�tes pas identifi�.
#1 20-03-2006 22:33:50
Menu css
Plop 
J'ai besoin d'un coup de main, j'ai beau chercher, je n'arrive pas au meme résultat sous ie et ff 
C'est soit l'un, soit l'autre mais je n'arrive pas à caler le #menu de cette page :
http://www.culturellement.com/
Y'a un gourou en css par là ?
Merci d'avance :p
Hors ligne
#2 20-03-2006 22:54:29
Re: Menu css
Hey
Essaye voir de passer un line-height:35px; dans ton menu 
Hors ligne
#3 20-03-2006 22:55:47
- tom_sawyer
- Search & Replace
- Lieu: Lyon
- Date d'inscription: 29-09-2005
- Messages: 2068
- Site web
Re: Menu css
Hello
je suis loin d'être un gourou mais je ferais un truc dans ce style :
position:absolute;top:80px; dans le #menu ul
C'est ça que tu veux faire ?
++
Toms
Hors ligne
#4 20-03-2006 23:01:08
Re: Menu css
Hmm y'a du mieux
Avec le line-height, ca passe sous ff, mais ca foire le padding sous ie.
Avec le position:absolute; et le top:80px, je suis bien mais pas aligné à gauche sous ie ...
GRRRR je m'arrache les cheveux depuis 2 jours là dessus lol 
Hors ligne
#5 20-03-2006 23:13:31
Re: Menu css
Code:
#menu ul {
margin:0;
padding:0;
left:5px;
}
#menu li {
margin:0;
padding:0;
}
#menu li {
line-height:34px;
}J'ai pas tous mes outils pour dev à l'heure actuelle, je reçois une carte graphique fonctionnelle mercredi ou jeudi, mais ça ça doit passer
Faudrait que tu mettes en ligne les différents résultats avec nos propositions, pour voir le rendu par nous même et avancer.
PS: Tu as eu le CV de mon frère ?
Derni�re modification par Phobos (20-03-2006 23:14:44)
Hors ligne
Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/tgarchive/forum/include/parser.php on line 313
Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /home/tgarchive/forum/include/parser.php on line 414
#6 20-03-2006 23:23:45
Re: Menu css
© 1996-2006 www.culturellement.com
10 ans d'âge ? Wow !!! 
C'est à toi ? On te l'a offert pour ton brevet des collèges ou tu l'as volé ?
Hors ligne
#8 21-03-2006 09:26:40
Re: Menu css
J'ai fait un truc dans le genre sur http://www.france-patrimoine.fr/
Le header :
Code:
<div class="conteneur"> <div class="header"><a href="http://www.france-patrimoine.fr/index.php" title="ACCUEIL : immobilier neuf et défiscalisation à Montpellier">ACCUEIL</a> | <a href="http://www.france-patrimoine.fr/programme-immobilier-neuf/index.php" title="nos programmes immobiliers neufs à Montpellier et en Languedoc-Roussillon">NOS PROGRAMMES NEUFS</a> | <a href="http://www.france-patrimoine.fr/etude-fiscale-patrimoniale.php" title="étude fiscale et patrimoniale gratuite">SIMULATION FINANCIERE PERSONNALISEE</a> | <a href="http://www.france-patrimoine.fr/coordonnees.php" title="contacter France Patrimoine Montpellier">NOUS CONTACTER</a> </div>
La CSS :
Code:
* {margin: 0px; padding: 0px;}
body {font-family:Verdana; font-size:0.7em; background-color:#FAFAFA}
.conteneur { width:680px; min-height:100%; margin-left: auto; margin-right: auto; border-width : 0px 1px 1px 1px; border-style : solid; border-color:#999999; background-color:#FFFFFF}
.header { width:680px; height:23px; background: url(http://www.france-patrimoine.fr/_img/header.gif) top no-repeat; background-color:#005194;padding-top:160px; font-family: Arial;font-size: 0.9em;color:#FFFFFF; font-weight:bold; text-align: center; margin-bottom:40px}
.header A:visited {text-decoration: none; color: #FFFFFF;margin:0px 6px 0px 6px}
.header A:link { text-decoration: none; color: #FFFFFF;margin:0px 6px 0px 6px}
.header A:hover {text-decoration: underline; color: #F0F0FF;margin:0px 6px 0px 6px}Ici c'est le 'padding-top' du header qui libère l'espace pour l'image de fond et place les liens en bas.
"La forme, c'est le fond qui remonte à la surface." Victor Hugo
Mon blog sur le webmarketing | Mon job
Hors ligne
#9 22-03-2006 17:48:47
Re: Menu css
Lu Sid,
Voilà un code sympa qui devrait fonctionner :
Code:
#menu {width:760px; }
#menu ul, #menu li {display:inline; list-style-type:none; }
#menu li{float:left; text-align:center; font-weight:bold; }
#menu a {color:#5A1069; width:152px; height:35px; vertical-align:middle; display:block; background: transparent url("img/menu.png") repeat-x 0 0; }
#menu a:hover{text-decoration:none; background: transparent url("img/menu.png") repeat-x 0 -35px; }Il te faut prendre la même image de fond pour l'état a et a:hover sauf quelle doit faire 70px de haut les 35 premier px dans la hauteur sont l'image en etat "a" et les 35px du bas sont l'image en etat survolé cela evitera que tu ais un effet de clignotement du au chargement d'image par IE.
Tu devras peut-être donné une id a tes balises "a" pour personnalisé la largeur fixé ici a 152px.
Hors ligne