separer le menu de son texte

Question

Bonjour,voila j'ai fais un page avec son menu et tout, mais le probleme c'est que je n'arrive pas mettre mon tableau devant mon menu et je ne sais pas comment les separer voici ma page amine .

BURNOUT PARADISE	Friday Night Smackdown	LEFT 4 DEAD

Burnout Paradise est un jeu de courses PC . compressé de 3 go à 580 mo	friday night smackdown est un jeu PC, sa taille est de 254 mo	Left 4 Dead sur PC est un FPS horrifique basé en grande partie sur la coopération
FIFA 2008	WINNING ELEVEN 2009	FAR CRY 2

EA lance sa mouture 2008 de sa grande licence footballistique FIFA sur PC	winning eleven 2009, le jeu sur pc. taille est de 290 mo	Ce deuxième volet sur PC ne vous conduit plus sur une île paradisiaque, mais au coeur de la savane africaine. Far cry 2, FULL RIP, 3 go et 350 mo
PURE 2008	NEED FOR SPEED undercover	PES 2009

Pure sur PC est un jeu de courses de quads se déroulant sur des circuits ouverts en pleine nature	Need for Speed Undercover est un jeu de course sur PC	Pro Evolution Soccer 2009 sur PC est une simulation de football axée sur le réalisme
NHL 2009	EURO 2008	CALL OF DUTY world at war

NHL 09 est un jeu de hockey sur PC. Cet opus amène un nouveau mode "Deviens Pro" où le joueur pourra créer son propre personnage	Euro 2008, 100% complet, taille du jeu: 761 mo	Call of Duty : World at War est un jeu de tir à la première personne sur PC. 5ème opus de la série

et voici le code css body { width: 760px; margin: auto; margin-top: 20px; margin-bottom: 20px; } /* Le menu */ #menu { float: left; /* Le menu flottera à gauche */ width: 120px; /* Très important : donner une taille au menu */ } .element_menu { background-color: #626262; background-image: url("images/motif.png"); background-repeat: repeat-x; border: 2px solid black; margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */ } et l'autre body { font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 80%; font-weight: bold; background: #FFF; } h2 { font: bold 14px Verdana, Arial, Helvetica, sans-serif; color: #000; margin: 0px; padding: 0px 0px 0px 15px; } ul { list-style: none; margin: 0; padding: 0; } img { border: none; } /*- Menu 1--------------------------- */ #menu1 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #3D261D; border-size: 1px; border-width: 1px; } #menu1 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu1 li a:link, #menu1 li a:visited { color: #E4D6CD; display: block; background: url(menu1.gif); padding: 8px 0 0 10px; } #menu1 li a:hover { color: #FFF; background: url(menu1.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 2--------------------------- */ #menu2 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #D8D5D1; border-size: 1px; border-width: 1px; } #menu2 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu2 li a:link, #menu2 li a:visited { color: #3688BA; display: block; background: url(menu2.gif); padding: 8px 0 0 30px; } #menu2 li a:hover { color: #3688BA; background: url(menu2.gif) 0 -32px; padding: 8px 0 0 32px; } /*- Menu 3--------------------------- */ #menu3 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #BCD2E6; border-size: 1px; border-width: 1px; } #menu3 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu3 li a:link, #menu3 li a:visited { color: #8BADCF; display: block; background: url(menu3.gif); padding: 8px 0 0 10px; } #menu3 li a:hover { color: #627EB7; background: url(menu3.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 4--------------------------- */ #menu4 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #000; border-size: 1px; border-width: 1px; } #menu4 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu4 li a:link, #menu4 li a:visited { color: #CCC; display: block; background: url(menu4.gif); padding: 8px 0 0 10px; } #menu4 li a:hover { color: #FFF; background: url(menu4.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 5--------------------------- */ #menu5 { width: 200px; margin: 10px; } #menu5 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu5 li a:link, #menu5 li a:visited { color: #FFF; display: block; background: url(menu5.gif); padding: 8px 0 0 10px; } #menu5 li a:hover { color: #FFF; background: url(menu5.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 6--------------------------- */ #menu6 { width: 200px; margin: 10px; } #menu6 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu6 li a:link, #menu6 li a:visited { color: #FFF; display: block; background: url(menu6.gif); padding: 8px 0 0 10px; } #menu6 li a:hover { color: #FFF; background: url(menu6.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 7--------------------------- */ #menu7 { width: 200px; margin: 10px; } #menu7 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu7 li a:link, #menu7 li a:visited { color: #FFF; display: block; background: url(menu7.gif); padding: 8px 0 0 30px; } #menu7 li a:hover { color: #FFF; background: url(menu7.gif) 0 -32px; padding: 8px 0 0 30px; } /*- Menu 8--------------------------- */ #menu8 { width: 200px; margin: 10px; border-style: solid; border-color: #656556; border-size: 1px; border-width: 1px; } #menu8 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu8 li a:link, #menu8 li a:visited { color: #656556; display: block; background: url(menu8.gif); padding: 8px 0 0 20px; } #menu8 li a:hover { color: #474739; background: url(menu8.gif) 0 -32px; padding: 8px 0 0 20px; } /*- Menu 9--------------------------- */ #menu9 { width: 200px; margin: 10px; } #menu9 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu9 li a:link, #menu9 li a:visited { color: #FFF; display: block; background: url(menu9.gif); padding: 8px 0 0 35px; } #menu9 li a:hover { color: #FFF; background: url(menu9.gif) 0 -32px; padding: 8px 0 0 35px; } /*- Menu 10--------------------------- */ #menu10 { width: 200px; margin: 10px; } #menu10 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu10 li a:link, #menu10 li a:visited { color: #4D4D4D; display: block; background: url(menu10.gif); padding: 8px 0 0 10px; } #menu10 li a:hover { color: #FF9834; background: url(menu10.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 11--------------------------- */ #menu11 { width: 200px; margin: 10px; border-style: solid solid none solid; border-color: #889944; border-size: 1px; border-width: 1px; } #menu11 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu11 li a:link, #menu11 li a:visited { color: #889944; display: block; background: url(menu11.gif); padding: 8px 0 0 25px; } #menu11 li a:hover { color: #889944; background: url(menu11.gif) 0 -32px; padding: 8px 0 0 27px; } /*- Menu 12--------------------------- */ #menu12 { width: 200px; margin: 10px; } #menu12 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 22px; text-decoration: none; } #menu12 li a:link, #menu12 li a:visited { color: #666; display: block; background: url(menu12.gif); padding: 10px 0 0 35px; } #menu12 li a:hover { color: #000; background: url(menu12.gif) 0 -32px; padding: 10px 0 0 35px; } /*- Menu 13--------------------------- */ #menu13 { width: 200px; margin: 10px; } #menu13 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu13 li a:link, #menu13 li a:visited { color: #C7377D; display: block; background: url(menu13.gif); padding: 8px 0 0 10px; } #menu13 li a:hover { color: #C7377D; background: url(menu13.gif) 0 -32px; padding: 8px 0 0 10px; } /*- Menu 14--------------------------- */ #menu14 { width: 200px; margin: 10px; } #menu14 li a { height: 32px; voice-family: "\"}\""; voice-family: inherit; height: 24px; text-decoration: none; } #menu14 li a:link, #menu14 li a:visited { color: #333; display: block; background: url(menu14.gif); padding: 8px 0 0 10px; } #menu14 li a:hover { color: #FFF; background: url(menu14.gif) 0 -32px; padding: 8px 0 0 10px; } aidez moi s'il vous plait et merci

jmg78 · Answer

on ne va pas lire tout ce code peux tu mettre un lien pour illustrer

aimar15 · Answer

comment je pourrait faire un lien??

jmg78 · Answer

ouille ça va etre dur ... tu tapes http://tinycorelinux.net par exemple

aimar15 · Answer

et ensuite

aimar15 · Answer

tu peut lire facilement le code. tu copie le code HTML dans ton logiciel  puis tu prend les css (les deux)  tu les copie dans notepad++ ou equivalent puis tu met les fichiers dans un dossier et tu ouvre le fichier HTML 

"c'est facile et vite fais"

aiacciu · Answer

Bonsoir, Alors je viens de regarder ton code, je te propose deux solution : - sois tu sépare ton menu et ton tableaux en deux div float left -soit tu rajoute un tableau ou il y aura une cellule à gauche contenant ton menu et une cellule à droite contenant ton tableau dans ce code j'ai utilisé la deuxime solution : amine .

BURNOUT PARADISE	Friday Night Smackdown	LEFT 4 DEAD

Burnout Paradise est un jeu de courses PC . compressé de 3 go à 580 mo	friday night smackdown est un jeu PC, sa taille est de 254 mo	Left 4 Dead sur PC est un FPS horrifique basé en grande partie sur la coopération
FIFA 2008	WINNING ELEVEN 2009	FAR CRY 2

EA lance sa mouture 2008 de sa grande licence footballistique FIFA sur PC	winning eleven 2009, le jeu sur pc. taille est de 290 mo	Ce deuxième volet sur PC ne vous conduit plus sur une île paradisiaque, mais au coeur de la savane africaine. Far cry 2, FULL RIP, 3 go et 350 mo
PURE 2008	NEED FOR SPEED undercover	PES 2009

Pure sur PC est un jeu de courses de quads se déroulant sur des circuits ouverts en pleine nature	Need for Speed Undercover est un jeu de course sur PC	Pro Evolution Soccer 2009 sur PC est une simulation de football axée sur le réalisme
NHL 2009	EURO 2008	CALL OF DUTY world at war

NHL 09 est un jeu de hockey sur PC. Cet opus amène un nouveau mode "Deviens Pro" où le joueur pourra créer son propre personnage	Euro 2008, 100% complet, taille du jeu: 761 mo	Call of Duty : World at War est un jeu de tir à la première personne sur PC. 5ème opus de la série

bon courage :)

aimar15 · Answer

ok merci beaucoup,beaucoup, tu as msn pour que je puisse te consulter facilement en cas de besoin

remarque: t malin!!  pour la 2 solution

aimar15 · Answer

une autre remarque comment tu as fais un tableau transparent??

aiacciu · Answer

:) il faut savoir ruser dans la programmation ! pour rendre transparent il te suffit juste de préciser au niveau de la balise table un border à 0 sa donne un truc du genre :

(gollum_2a@hotmail.com pour me contacter mais j'y suis pas souvent ...)

aimar15 · Answer

ok merci

??? · Answer

??? , ??? ???? ???? , ???, ?????

Separer le menu de son texte

11 réponses

Votre réponse

Discussions similaires

Newsletters