Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2395 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  css et menu

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

css et menu

n°1020084
la ptiote
Posté le 21-03-2005 à 19:26:18  profilanswer
 

Bonjour tous, une fois de plus j'ai besoin de vous :  
 
1/ espacer Hist et Dia quand on passe sur Mag par exemple.  
2/ m'expliquer ce qui décale petit à petit menu 2, menu 3 et menu 4 vers le bas au lieu qu'ils soient centrés au milieu des zones parmes.  
3/ Supprimer l'espace qui se trouve devant les sous menus ( - Sous-Menu 1.2, - Sous-Menu 1.3 par exemple)  
 
Merci de votre aide.  
J'ai déjà essayé plusieurs choses pour régler ces 3 problèmes mais n'ai pas trouvé de solution.  
 
 
La page initiale était http://perso.numericable.fr/~glaulagn/menu14.htm
Puis on m'a fait faire dans un autre forum http://perso.numericable.fr/~glaulagn/menu15.htm
Maintenant je suis plantée.  
Pouvez vous m'aider ?  
Merci  
 

mood
Publicité
Posté le 21-03-2005 à 19:26:18  profilanswer
 

n°1020113
masklinn
í dag viðrar vel til loftárása
Posté le 21-03-2005 à 19:44:37  profilanswer
 

1- placer les DTs en "position: relative"
2- height ~19px + padding bottom 50px
3- tu lui as demandé de te centrer ton texte, il te le centre
 
Accessoirement:
1- validator bordel
2- Utiliser le gestionnaire d'évènements javascript histoire de rendre le truc plus propre
3- utiliser des menus déroulants en CSS, et le JS uniquement quand le CSS n'est pas géré (MSIE)
4- le CSS, à écrire en minuscules, à optimiser et à indenter
5- le fichier HTML, idem


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1020145
la ptiote
Posté le 21-03-2005 à 20:23:42  profilanswer
 

Tu pars de quelle page menu 14 ou menu 15 ?
 
1/ J'ai mit le DT du menu haut menuB en "position: relative" mais cela ne change pas le pb, Hist et Dia sont toujours collés
2/ j'essaie mais ne trouve pas la solution, c'est toujours décalé petit à petit
3/ non, il me semble que je l'ai mis à gauche  
#menuA LI {
 FONT-SIZE: 12px; FONT-FAMILY: verdana, arial, sans-serif;  LINE-HEIGHT: 14px; HEIGHT:  
 
20px; TEXT-ALIGN: left
}
 
J'ai peu être pas tout compris ?

n°1020198
masklinn
í dag viðrar vel til loftárása
Posté le 21-03-2005 à 20:55:46  profilanswer
 

14
1- il faut ajouter "position:absolute","left:0" et "top: jesaispascombien" pour le DD qui correspond au DD
2- DT.menuA -> mettre toutes les marges et tous les paddings à 0 (margin: 0; padding: 0; et tu enlèves le reste)
#menuA DT -> height à 25px, margin-bottom à 40px
3-  

#menuA DT {
    TEXT-ALIGN: center


[:petrus75]
 
Et franchement, le HTML est pas terrible et le CSS est extrèmement crade, faudrait assainir le html et refaire tout le CSS pour avoir quelque chose de correct


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1020242
la ptiote
Posté le 21-03-2005 à 21:37:56  profilanswer
 

Je sais que c'est pas terrible, c'est mon premier essai avec les css, je crois pas avoir choisis le test le plus facile, mais on fait pas toujours ce que l'on veut.
 
A force de le modifier de tous les côtés je m'enlise et le code devient de plus en plus laid. Je viens de passer une semaine entière à essayer de faire marcher ce menu.
Je ne sais pas le faire propre, ça aurait été dans mes capacités, je l'aurais fait ...
 
Je viens de mettre en ligne sous http://perso.numericable.fr/~glaulagn/menu14.htm
Pas terrible n'est ce pas.
 
Concernant le point 3 c'est le sous menu (- Sous-Menu 1.2, - Sous-Menu 1.2, - Sous-Menu 1.3)que je cherche à coller à gauche

n°1020316
la ptiote
Posté le 21-03-2005 à 22:20:11  profilanswer
 

le menu de gauche à partir duquel je suis partie est : http://perso.numericable.fr/~glaul [...] rtical.htm
 
Normalement le code de ce menu est propre. Je l'ai prit sur http://css.alsacreations.com/modelesmenus/vd2.htm
 
Dans ma feuille de style, il me faut identifier les styles par rapport au menu qu'ils dirigent ainsi transformer mon sélecteur #menu en #menuG (je change de nom, plus menuA mais G comme gauche.
 
ceux qui s'apellaient LI {...} en LI.menuG.
Est ce exact par rapport au html présent sur ma page ?
 
Si cela est exact, alors dans le html, j'ai juste à transformer <DL id=menu> en <DL id=menuG> ?
 
Qu'en dis tu ?

n°1020341
masklinn
í dag viðrar vel til loftárása
Posté le 21-03-2005 à 22:40:19  profilanswer
 

1- Le menu d'Alsa n'est pas réellement propre, CSS dans le fichier HTML, JS idem, pas d'utilisation du gestionnaire d'évènements JS, tout plein de trucs en majuscule (on préfère habituellement les minuscules), CSS franchement pas optimisé (par exemple pas mal de gens on l'habitude de commencer par

* { margin: 0; padding: 0; }


histoire de "nettoyer" le comportement par défaut du navigateur, ça permet de partir sur de bonnes bases)
(toujours dans la non optimisation, au lieu d'utiliser 4 fois "border-*: 1px solid gray", un "border: 1px solid gray" et c'est torché)
2- TU NE DOIS PAS AVOIR LE MOINDRE INDICE DE MISE EN PAGE DANS TON HTML!
Donc pas de "menu_gauche" ou "menu_haut", seul le sens compte, des choses comme "menu_navigation", "menu_principal". De cette manière, si tu veux relooker le site tu n'as pas à toucher au HTML (juste à refaire le CSS), et une personne qui regarde le source pourra comprendre la structure logique du document.
 
Accessoirement, il faut utiliser les capacités d'héritage et de cascade du HTML.
 
Tuto sur les menus CSS, c'est pas le cas qui t'intéresse mais ça peut te servir quand même
Liens pour le dev web
Et enfin ce qui peut le plus t'intéresser (mais il faut que tu le comprennes, ce qui n'est pas nécessairement aisé ;) ) le menu CSS/DOM de Nick Rigby, il est simple, propre, et il fonctionne dans à peu près tous les navigateurs


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1020394
la ptiote
Posté le 21-03-2005 à 23:10:55  profilanswer
 

Tu m'étonnes que c'est pas aisé !!!!
Au moins avec mes tableaux, à l'ancienne, j'avais qq chose de visuel dés le début. Ou alors à l'époque j'apprenais vite et bien ...
Merci pour tes liens, je vais regarder tout ça et continuer à travailler.
Les CSS c'est trop dur !!!

n°1020400
FlorentG
Posté le 21-03-2005 à 23:12:30  profilanswer
 

la ptiote a écrit :

Tu m'étonnes que c'est pas aisé !!!!
Au moins avec mes tableaux, à l'ancienne, j'avais qq chose de visuel dés le début. Ou alors à l'époque j'apprenais vite et bien ...
Merci pour tes liens, je vais regarder tout ça et continuer à travailler.
Les CSS c'est trop dur !!!


T'avais quelque chose de visuel sur ton écran d'ordinateur. Moi sur mon mobile, j'avais un mal fou à voir ton site. Lorsque je voulais imprimer ton site, bonjour le bordel :( Et mon copain maurice qui est malvoyant, son lecteur d'écran perdait les pédales et retranscrivait ton site dans n'importe quel ordre :(

n°1020404
masklinn
í dag viðrar vel til loftárása
Posté le 21-03-2005 à 23:12:50  profilanswer
 

C'est pas spécialement dur, mais ça demande de changer quelque peu la manière qu'on a de penser et le processus de conception du site (c'est beau ce que je dis [:kbchris])


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
mood
Publicité
Posté le 21-03-2005 à 23:12:50  profilanswer
 

n°1020422
la ptiote
Posté le 21-03-2005 à 23:19:12  profilanswer
 

Ben j'sais bien que c'était pas l'idéal. J'ai jammais dit le contraire mais là j'ai l'impression d'avoir l'age de ma fille (12 mois et d'apprendre en même temps à marcher, courrir, sauter, compter .... bref le champs d'application est tellement grand que l'on sait pas comment et par ou commencer.
Au fait vous avez pas des liens en français parce que j'ai déjà du mal à comprendre tout les mots dans ma langue natale alors ....

n°1020429
FlorentG
Posté le 21-03-2005 à 23:21:47  profilanswer
 

Bienvenue dans le fabuleux métier de développeur. Tu va découvrir qu'il va te falloir tout réapprendre tous les 6 mois en moyenne :D

n°1020454
masklinn
í dag viðrar vel til loftárása
Posté le 21-03-2005 à 23:30:21  profilanswer
 

Dans mes liens, il y a des sites en français (OpenWeb, Alsacréation et CSS Débutants pour ne citer que 3 sites d'initiation)


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1020505
la ptiote
Posté le 21-03-2005 à 23:52:46  profilanswer
 

Je connais les 2 premiers mais pas le dernier.
Mais vu que a base de mon menu venait de Alsacréation, et étant donné tes commentaires sur ce même menu, je ne sais plus trop si je dois m'y fier ...

n°1020544
masklinn
í dag viðrar vel til loftárása
Posté le 22-03-2005 à 00:20:31  profilanswer
 

Alsacréation est en général un bon site, et le forum est très bon, mais il n'est pas parfait [:spamafote]
Et le menu HTML/CSS/JS est probablement l'une des pires choses qu'on puisse trouver venant d'Alsa (et l'une des rares qui soient critiquables en fait).
 
Faudrait que je milite pour qu'il soit refait quand même :gratgrat:
 
Ou alors Florent, toi qui poste sur Alsa, tu pourrais pas te démerder pour qu'ils refassent le tuto avec un truc proche du menu donné dans A List Apart?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1020613
FlorentG
Posté le 22-03-2005 à 07:53:41  profilanswer
 

Le mec d'alsa, alias Sibelius, passe par ici assez souvent, si ça se trouve il verra ton post :D Sinon ça sera peut-être fait du côté d'OpenWeb, ça à l'air de pas mal bouger là :)

n°1020629
la ptiote
Posté le 22-03-2005 à 08:40:24  profilanswer
 

Bon, c'est quand meme rassurant puisque mes maigres connaissances je les ai apprises là bas, chez Alsacréation.
Les tutos sont bien fait.
Disons que je suis tombée sur les mauvais menus.
Remarques, j'achète des chaussettes elles sont trouées ... alors pourquoi pas les menus ...

n°1020670
sibelius
Vous êtes sûr ?
Posté le 22-03-2005 à 09:55:42  profilanswer
 

Hey, mais on parle de moi ? Bon, alors rapidement :
 

Citation :

Le menu d'Alsa n'est pas réellement propre, CSS dans le fichier HTML, JS idem


Tout à fait exact, mais ceci a été fait suite aux centaines de mails de débutants qui ne comprenaient pas que leur menu ne fonctionnait pas (ben oui, au début, CSS et JS étaient à part et les débutants croyaient que tout se trouvaient sur le document HTML)
Donc, oui, il suffit pour être propre de séparer les CSS et le JS.
 

Citation :

tout plein de trucs en majuscule (on préfère habituellement les minuscules)

Euh ah bon ? J'ai pourtant la source en face de moi et je ne vois aucune majuscule dans le code de ce menu.
 

Citation :

(par exemple pas mal de gens on l'habitude de commencer par
* { margin: 0; padding: 0; }
histoire de "nettoyer" le comportement par défaut du navigateur, ça permet de partir sur de bonnes bases)

C'est une technique utile, mais qui est parfois décriée par certains puristes (et je les comprends) : http://forum.alsacreations.com/top [...] 14&tid=631
J'évite pour ma part de l'utiliser systématiquement.
 

Citation :

Et le menu HTML/CSS/JS est probablement l'une des pires choses qu'on puisse trouver venant d'Alsa


Je suis d'accord, notamment au sujet de l'utilisation des listes de définition qui devraient être remplacées par des listes normales.
D'ailleurs il faudrait que je trouve le temps de refaire ce tuto. Malheureusement ce ne sera pas dans l'immédiat :/
 

Citation :

Ou alors Florent, toi qui poste sur Alsa, tu pourrais pas te démerder pour qu'ils refassent le tuto


"Ils", c'est moi. Je suis seul sur Alsa ;) Mais si quelqu'un veut me donner un coup de main et refaire ce tuto, ce serait avec plaisir :)


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°1020672
FlorentG
Posté le 22-03-2005 à 09:56:34  profilanswer
 

Ah ouais tiens, on pourrait le refaire à l'occaze :jap:

n°1020737
masklinn
í dag viðrar vel til loftárása
Posté le 22-03-2005 à 10:45:21  profilanswer
 

sibelius a écrit :

Tout à fait exact, mais ceci a été fait suite aux centaines de mails de débutants qui ne comprenaient pas que leur menu ne fonctionnait pas (ben oui, au début, CSS et JS étaient à part et les débutants croyaient que tout se trouvaient sur le document HTML)
Donc, oui, il suffit pour être propre de séparer les CSS et le JS.


Ok, je vois la raison de la fusion, mais la séparation manuelle ne mettrait pas en place l'utilisation d'un gestionnaire d'évènements (qui est quand même bien pratique pour avoir un document "propre" :o)
 

Citation :

Euh ah bon ? J'ai pourtant la source en face de moi et je ne vois aucune majuscule dans le code de ce menu.


Je suis retourné vérifier, et effectivement pas de majs dans le source originel, j'ai dû fumer un truc avarié :jap:  
 

Citation :

(par exemple pas mal de gens on l'habitude de commencer par
* { margin: 0; padding: 0; }
histoire de "nettoyer" le comportement par défaut du navigateur, ça permet de partir sur de bonnes bases)

C'est une technique utile, mais qui est parfois décriée par certains puristes (et je les comprends) : http://forum.alsacreations.com/top [...] 14&tid=631
J'évite pour ma part de l'utiliser systématiquement.
 

Citation :


Je suis d'accord, notamment au sujet de l'utilisation des listes de définition qui devraient être remplacées par des listes normales.


Bien que je préfère les listes normales, l'utilisation des listes de définitions est défendable, c'est plus une question de philosophie de logique de page (la manière dont on considère un menu nested).
Donc je n'ai personnellement rien contre.

Citation :

D'ailleurs il faudrait que je trouve le temps de refaire ce tuto. Malheureusement ce ne sera pas dans l'immédiat :/


Si je trouve le temps de m'y mettre, je peux m'en charger et te le soumettre 'k?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1020742
sibelius
Vous êtes sûr ?
Posté le 22-03-2005 à 10:49:49  profilanswer
 

Citation :


Si je trouve le temps de m'y mettre, je peux m'en charger et te le soumettre 'k?


Oui parfaitement, ce serait avec plaisir de trouver quelques coups de mains de temps en temps.
D'ailleurs, je pense que je peux même te créer un compte rédacteur sur le CMS (Plume) d'Alsa, tu pourras alors gérer ton (ou tes) article(s) comme tu le sens ;)
 
Si tu veux, tu peux me contacter directement par MP sur le forum Alsa, ce sera plus pratique pour moi


Message édité par sibelius le 22-03-2005 à 11:06:21

---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
n°1020754
la ptiote
Posté le 22-03-2005 à 11:00:05  profilanswer
 

Faites moi savoir si vous le refaites, j'aimerai bien en profiter.
Au moins ma galère aura fait avancer ce menu.
La p'tiote qui se sent vraiment toute p'tiote face au CSS, mais qui finira par y arriver.

n°1020770
FlorentG
Posté le 22-03-2005 à 11:14:50  profilanswer
 

sibelius a écrit :

Citation :


Si je trouve le temps de m'y mettre, je peux m'en charger et te le soumettre 'k?


Oui parfaitement, ce serait avec plaisir de trouver quelques coups de mains de temps en temps.
D'ailleurs, je pense que je peux même te créer un compte rédacteur sur le CMS (Plume) d'Alsa, tu pourras alors gérer ton (ou tes) article(s) comme tu le sens ;)
 
Si tu veux, tu peux me contacter directement par MP sur le forum Alsa, ce sera plus pratique pour moi


Ok ça roule :)

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  css et menu

 

Sujets relatifs
Menu CSSMenu dynamique (problème avec visibility)
probleme de decalage d'un sous menu en javascript avec IErendre impossible de cliquer sur un menu
[VBA] Access, rafraichir automatiquement un menu déroulant[CSS] Alignement vertical d'un menu d'images?
récupérer le texte dans un menu déroulantmenu
[FLASH XML] insérer une image dans mon menu ?Menu arborescent
Plus de sujets relatifs à : css et menu


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR