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

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Menu vertical.

 


 Mot :   Pseudo :  
 
 Page :   1  2
Page Précédente
Auteur Sujet :

Menu vertical.

n°1126475
robinpintr​in
Posté le 21-06-2005 à 16:35:02  profilanswer
 

bonjour
 
 je viens de crée un menu vertical:
 
 http://img28.echo.cx/img28/4228/sanstitre1jpg0qj.jpg
 
 Et je voulais que quand on met le curseur sur un lien, il met le fond en noir et
 l'ecriture en blanc, voila mon code :
 
 

Code :
  1. <html>
  2. <head>
  3. <style type="text/css">
  4. .menu  {
  5. height:30;
  6. width:150;
  7. background-color : gray ;
  8. border: 2 solid #black;
  9.        }
  10. .menu a {
  11. width:100%;
  12. border: 2 solid #black;
  13. text-decoration: none;
  14. color: black;
  15.         }
  16. .menu a:hover  {
  17. background-color: black;
  18. color: #ffffff;
  19.                }
  20. </style>
  21. </head>
  22. <body>
  23. <ul class="menu">
  24. <li><a href="#">1er</a></li>
  25. <li><a href="#">2eme</a></li>
  26. <li><a href="#">3eme</a></li>
  27. <li><a href="#">4eme</a></li>
  28. <li><a href="#">5eme</a></li>
  29. <li><a href="#">6eme</a></li>
  30. <li><a href="#">7eme</a></li>
  31. <li><a href="#">8eme</a></li>
  32. <li><a href="#">9eme</a></li>
  33. <li><a href="#">10eme</a></li>
  34. </ul>
  35. </body>
  36. </html>


 
 le problème, c'est que quand je vais sur un lien :
 
 http://img28.echo.cx/img28/5092/sanstitre25bn.jpg
 
 La bordure du lien se met elle aussi en blanc.
 
 
 J'ai fait un effort pour toi Masklinn, pour l'hortographe et la présentation,
 j'espere que c'est clair pour vous
 pouvez vous m'aidez ????


---------------
mon site perso aller visiter
mood
Publicité
Posté le 21-06-2005 à 16:35:02  profilanswer
 

n°1126486
FlorentG
Unité de Masse
Posté le 21-06-2005 à 16:43:08  profilanswer
 

border: 2 solid #black;


A mon avis, le #black ne risque pas de fonctionner. Et pis c'est 2 quoi ? Pieds ? Voitures ? Oranges ? :D

border: 2px solid black;

n°1126487
FlorentG
Unité de Masse
Posté le 21-06-2005 à 16:43:23  profilanswer
 

Pareil pour les autres unités, il faut toujours préciser ce que c'est...

n°1126495
gatsusat
Posté le 21-06-2005 à 16:48:14  profilanswer
 

+1 pour FlorentG
 
et +1 pour notre ti Rintintin (ouais j'en fais exprès lol) au moins tu essaye de te mettre aux normes

n°1126544
robinpintr​in
Posté le 21-06-2005 à 17:31:02  profilanswer
 

FlorentG a écrit :

border: 2 solid #black;


A mon avis, le #black ne risque pas de fonctionner. Et pis c'est 2 quoi ? Pieds ? Voitures ? Oranges ? :D

border: 2px solid black;



 
hooooooooooooooo merci FlorentG !! sa marche trop tranquille, merci beaucoup
 
a oui, j'ai une autre question:
 
comment faire ceci en CSS:
 
http://img257.echo.cx/img257/4647/sanstitre1copie9dp.jpg
 
 comment faut il resoner pour crée un site de cette façon ??????


---------------
mon site perso aller visiter
n°1126551
gatsusat
Posté le 21-06-2005 à 17:33:00  profilanswer
 

de 2 manières
 
tu as ton block menu et tu lui met un float:left
et tu as un bloc Contenu normalement ca passe.

n°1126556
robinpintr​in
Posté le 21-06-2005 à 17:38:13  profilanswer
 

oula j'ai pas très bien compris tu peus mieu t'espliqué stp
on vas dire que mon menu s'apelle "menu" et mon resumer de  
site s'apelle "resumer" comment faut il que je fasse ????
dit la maniere la mieu !!
 
merci d'avance


Message édité par robinpintrin le 21-06-2005 à 17:38:27

---------------
mon site perso aller visiter
n°1126571
masklinn
í dag viðrar vel til loftárása
Posté le 21-06-2005 à 17:55:18  profilanswer
 

robinpintrin a écrit :

oula j'ai pas très bien compris tu peus mieu t'espliqué stp
on vas dire que mon menu s'apelle "menu" et mon resumer de  
site s'apelle "resumer" comment faut il que je fasse ????
dit la maniere la mieu !!
 
merci d'avance


Méthode 1:
tu mets un "float: left" sur "menu"
 
Méthode 2:
tu utilises "position: absolute" sur "menu" pour le placer sur la page et le sortir du flux, puis tu ajoutes une marge gauche à "résumé", légèrement plus grande que la taille du menu + le positionnement de celui-ci par rapport à la gauche de ton écran


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1126631
robinpintr​in
Posté le 21-06-2005 à 19:25:59  profilanswer
 

ok ok merci j'ai bien compris se que tu as dit, jtm bien, tu es bien précis dans tes reponses, mais au faite, tu es un moderateur ou tu skouate tout le temps se forum ???
 
et une postion relative c'est quoi exactement ???


Message édité par robinpintrin le 21-06-2005 à 19:26:53

---------------
mon site perso aller visiter
n°1126633
gatsusat
Posté le 21-06-2005 à 19:27:22  profilanswer
 

c'est un squatteur qui dont le niveau en XHTML/CSS/JS n'est pas négligable. En gros lis tous ses messages ils seront très instructifs.
 
c'est aussi valable pour FlorentG


Message édité par gatsusat le 21-06-2005 à 19:31:40
mood
Publicité
Posté le 21-06-2005 à 19:27:22  profilanswer
 

n°1126635
robinpintr​in
Posté le 21-06-2005 à 19:30:36  profilanswer
 

ok ok merci


---------------
mon site perso aller visiter
n°1126649
robinpintr​in
Posté le 21-06-2005 à 19:54:24  profilanswer
 

mais comment on fait pour postionner un bloc en position
absolu à :200px de la gauche
            0  px du haut
 
???????????


Message édité par robinpintrin le 21-06-2005 à 20:02:50

---------------
mon site perso aller visiter
n°1126653
FlorentG
Unité de Masse
Posté le 21-06-2005 à 20:08:55  profilanswer
 

pouet {
  position: absolute;
  top: 0;
  left: 200px;
}

n°1126684
masklinn
í dag viðrar vel til loftárása
Posté le 21-06-2005 à 20:51:34  profilanswer
 

Je pense que la lecture des sites CSS Débutant, OpenWeb et AlsaCréations pourrait t'être utiles, parce que le positionnement et le flux font partie des bases des CSS.
 
Et non je ne suis pas modo ('sont tous des fachos [:mmmfff])
 
Pompage.net est également un très bon site, et ils font actuellement une suite d'articles  sur les CSS
 
Après tout ça, tu peux aller visiter ma sig, elle contient mes favoris de dev web.


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1126732
robinpintr​in
Posté le 21-06-2005 à 21:29:09  profilanswer
 

ps dans ton lien créez vos sites web, la source est ecrite en quoi ?????


---------------
mon site perso aller visiter
n°1126737
gatsusat
Posté le 21-06-2005 à 21:31:39  profilanswer
 

c'est juste l'export des bookmark de netscape ou firefox
 
mais ca reste du HTML orienté sauce netscape pour pouvoir faire l'import de ces bookmarks ailleurs

n°1126746
masklinn
í dag viðrar vel til loftárása
Posté le 21-06-2005 à 21:43:21  profilanswer
 

robinpintrin a écrit :

ps dans ton lien créez vos sites web, la source est ecrite en quoi ?????


C'est du HTML violement modifié (du SGML quoi), c'est l'export des favoris de Firefox sans la moindre retouche [:petrus75]
 
Donc c'est super crade, mais ça m'emmerde de le nettoyer [:petrus75]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1126753
robinpintr​in
Posté le 21-06-2005 à 21:49:51  profilanswer
 

ok lol je demande sa car la page a l'air vachement lourde !!
 
lol


---------------
mon site perso aller visiter
n°1126939
FlorentG
Unité de Masse
Posté le 22-06-2005 à 00:38:21  profilanswer
 

Précision :

Citation :

<!DOCTYPE NETSCAPE-Bookmark-file-1>


C'est très spécial ;)

n°1127137
robinpintr​in
Posté le 22-06-2005 à 10:54:54  profilanswer
 

j'ai une autre question, en avançant dans mon site, je voulais crée un menu hrizontale voici mon code :  [:itm]  
 

Code :
  1. .menudroit  {
  2. width: 790px;
  3. height:40px;
  4. background-color: gray;
  5. border: 2px solid black;
  6. margin-top: 10px;
  7.             }
  8. .menudroit a {
  9. width: 10.6%;
  10. height: 99.9%;
  11. color: black;
  12. border: 2px solid black;
  13. text-align: center;
  14. margin-left: 0px;
  15. padding-top: 3px;
  16.              }
  17. .menudroit a:hover {
  18. background-color: black;
  19. color: pink;
  20. border: 2px solid black;
  21.                     }


 
Voici ce que cela me donne (sans compter les autres menu et les images du site)
 
http://img57.echo.cx/img57/1104/sanstitre1copie2ld.jpg
 
Il y a des espaces entre les différants lien ??? comment faire pour les enlever ?
Ex: entre les lien 3 et 4 il y a un espace qui ne fait pas parti du lien


Message édité par robinpintrin le 22-06-2005 à 11:40:29

---------------
mon site perso aller visiter
n°1127279
Badze
Aime les frites
Posté le 22-06-2005 à 12:38:37  profilanswer
 

hum t sur de ne pas nous donner le mauvais code, je lis menudroit donc je me pose des questions :S

n°1127293
robinpintr​in
Posté le 22-06-2005 à 13:03:31  profilanswer
 

mais j'ai mis menu droit car il y avait deja "menu"( celui qui est vertical) mais esseye, sur ton bloc note !! tu verra !! sa fait comme moi !!!!  
 
Mon code HTML est celui la :

 

Code :
  1. <div class="menudroit">
  2. <a href="#">1er</a>
  3. <a href="#">3eme</a>
  4. <a href="#">4me</a>
  5. <a href="#">5eme</a>
  6. <a href="#">6eme</a>
  7. <a href="#">7eme</a>
  8. <a href="#">8me</a>
  9. <a href="#">9eme</a>
  10. <a href="#">10eme</a>
  11. </div>[


 
 
esqu'il est bien de crée un site en HTML avec que des boc en position absolu !!!!(en le metan centré avec des espaces sur les coté pour qu'il n'y est pas de jeu de barres de scroll ?????


---------------
mon site perso aller visiter
n°1127299
gatsusat
Posté le 22-06-2005 à 13:13:26  profilanswer
 

normalment le div n'a pas de padding, tu fous les margin à 0 pour le A et un width 100%
ainsi que un border-collapse: collapse

n°1127301
FlorentG
Unité de Masse
Posté le 22-06-2005 à 13:14:07  profilanswer
 

Et au passage, c'est pas une div qu'il faut utiliser, mais une liste :o

n°1127304
gatsusat
Posté le 22-06-2005 à 13:16:46  profilanswer
 

+1 FlorentG, je ne lui dit pas, laissons le pour le moment déjà reussir son PB, ensuite il pourra passer à une liste

n°1127307
robinpintr​in
Posté le 22-06-2005 à 13:18:38  profilanswer
 

pk, pourtant c'est un menu horizontalen, et quan je met   "ul" "li" "li" "li" "li" "li" "/ul", sa foire tout il met mes lien sur plusieur ligne(le nombre de li)


---------------
mon site perso aller visiter
n°1127311
Badze
Aime les frites
Posté le 22-06-2005 à 13:25:49  profilanswer
 

il faut que tu mette float dans LI, tu aura ainsi une liste horizontale
 

Code :
  1. ul,li { float:left;
  2. list-style-type: none;
  3. margin: 0 1;
  4. padding: 0;}


Message édité par Badze le 22-06-2005 à 13:26:36
n°1127313
gatsusat
Posté le 22-06-2005 à 13:26:30  profilanswer
 

le mieux c'est de fermer les LI
 
<ul>
<li><a href="#">lien 1</a></li>
<li><a href="#">lien 2</a></li>
<li><a href="#">lien 3</a></li>
<li><a href="#">lien 4</a></li>
<ul>
 
c'est comme ça que doivent être les menus, aussi bien horizontaux que verticaux.
 
ensutie tu peux t'inspirer de http://css.maxdesign.com.au/listamatic/
pour trouver une liste à ton gout et la remanier pour ton site

n°1127316
Badze
Aime les frites
Posté le 22-06-2005 à 13:28:41  profilanswer
 

http://css.alsacreations.com/xmedi [...] zontal.htm
 
fais le tour de different CSS, tu comprendra a fur et a mesure, je tire encore dure mais avec le temps et la pratique ça devrai arriver :p

n°1127764
robinpintr​in
Posté le 22-06-2005 à 19:01:21  profilanswer
 

ok mais j'ai une question :
ça sert a quoi les balises <dl><dt><dd> ???????  pourquoi ça se peu que quand on met :
<ul>
 <li>...
 <li>...
 <li>...
 <li>...
</ul>
 
il affiche les liste sur une ligne et non a la ligne ??


---------------
mon site perso aller visiter
n°1127765
robinpintr​in
Posté le 22-06-2005 à 19:02:44  profilanswer
 

a oui dsl c'est bon j'ai trouver, on met un float: left !! merci ! quand meme
mais par contre pour <dl><dt><dd> je sais pas a quoi ça sert


Message édité par robinpintrin le 22-06-2005 à 19:03:24

---------------
mon site perso aller visiter
n°1127770
robinpintr​in
Posté le 22-06-2005 à 19:15:02  profilanswer
 

j'ai mis float:left; et voici mon code :
 
 

Code :
  1. PARTIE CSS:
  2. .menudroit  {
  3. width: 790px;
  4. height:40px;
  5. background-color: gray;
  6. border: 2px solid black;
  7. margin-top: 10px;
  8. .menudroit  a {
  9. width: 10%;
  10. height: 99.9%;
  11. color: black;
  12. border: 2px solid black;
  13. text-align: center;
  14. foat: left;
  15. padding-top: 3px;
  16.              }
  17. .menudroit li  {
  18. float: left;
  19.               }
  20. .menudroit li a:hover {
  21. background-color: black;
  22. color: pink;
  23. border: 2px solid black;
  24. foat: left;
  25.                    }
  26. PARTIE HTML :
  27. <ul class="menudroit">
  28. <li><a href="#">1er</a></li>
  29. <li><a href="#">3eme</a></li>
  30. <li><a href="#">4me</a></li>
  31. <li><a href="#">5eme</a></li>
  32. <li><a href="#">6eme</a></li>
  33. <li><a href="#">7eme</a></li>
  34. <li><a href="#">8me</a></li>
  35. <li><a href="#">9eme</a></li>
  36. <li><a href="#">10eme</a></li>
  37. </ul>


 
et voila se que je vois :
 
http://img241.echo.cx/img241/6642/sanstitre1copie4sw.jpg
 
c'est completement bizard !!!! comment cela de fait ????


Message édité par robinpintrin le 22-06-2005 à 19:15:41

---------------
mon site perso aller visiter
n°1127775
plainsofpa​in
Pingouino's lover
Posté le 22-06-2005 à 19:18:51  profilanswer
 

foat:left, ca existe pas.
 
float oui ^^'


---------------
http://www.alsacreations.com , http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net/. Exemple à ne surtout pas suivre : www.worldinternet.be
n°1127786
robinpintr​in
Posté le 22-06-2005 à 19:36:25  profilanswer
 

oui merci mais ça change rien !!!!! toujours la meme presentation !!


---------------
mon site perso aller visiter
n°1127852
FlorentG
Unité de Masse
Posté le 22-06-2005 à 20:42:37  profilanswer
 

Y'a display: block; qui est aussi utile

n°1127859
plainsofpa​in
Pingouino's lover
Posté le 22-06-2005 à 20:44:42  profilanswer
 

Eventuellement ca marchera mieux avec oui ;)


---------------
http://www.alsacreations.com , http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net/. Exemple à ne surtout pas suivre : www.worldinternet.be
n°1127862
masklinn
í dag viðrar vel til loftárása
Posté le 22-06-2005 à 20:45:51  profilanswer
 

robinpintrin a écrit :

a oui dsl c'est bon j'ai trouver, on met un float: left !! merci ! quand meme
mais par contre pour <dl><dt><dd> je sais pas a quoi ça sert


Read The Fucking Manual ?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1127896
robinpintr​in
Posté le 22-06-2005 à 21:02:16  profilanswer
 

pareil !!!  sa change pas
 
PS sa sert a quoi de mettre display bloc ??


---------------
mon site perso aller visiter
n°1127899
masklinn
í dag viðrar vel til loftárása
Posté le 22-06-2005 à 21:05:32  profilanswer
 

robinpintrin a écrit :

pareil !!!  sa change pas
 
PS sa sert a quoi de mettre display bloc ??


Read The Fucking Documentation?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1127900
FlorentG
Unité de Masse
Posté le 22-06-2005 à 21:05:38  profilanswer
 

Bon... Va lire la documentation sur les CSS, t'en a bien besoin :(

mood
Publicité
Posté le   profilanswer
 

 Page :   1  2
Page Précédente

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

  Menu vertical.

 

Sujets relatifs
menu image cssImpossible de cocher un élément de mon menu (MFC)
problème de menu en flash...,[PHP - MySQL] Insertion nouvel item ds menu déroulant
[Résolu] recuperation valeur menu déroulant[CSS] Alignement vertical d'un menu d'images?
Faire remonter un menu dynamique verticaljavascript pour menu déroulant vertical
Comment faire un menu vertical avec images + ouverture[JAVASCRIPT] menu vertical avec images
Plus de sujets relatifs à : Menu vertical.


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