CONNEXION
  • RetourJeux
    • Sorties
    • Hit Parade
    • Les + populaires
    • Les + attendus
    • Soluces
    • Tous les Jeux
    • Gaming
  • RetourActu Gaming
    • News
    • Astuces
    • Tests
    • Previews
    • Toute l'actu gaming
  • RetourBons plans
    • Bons plans
    • Bons plans Smartphone
    • Bons plans Hardware
    • Bons plans Image et Son
    • Bons plans Amazon
    • Bons plans Cdiscount
    • Bons plans Decathlon
    • Bons plans Fnac
    • Tous les Bons plans
  • RetourJVTech
    • Actus High-Tech
    • Intelligence Artificielle
    • Smartphones
    • Mobilité urbaine
    • Hardware
    • Image et son
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTech
  • RetourCulture
    • Actus Culture
    • Culture
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch 2
    • Xbox Series
    • Switch
    • Pokemon pocket
    • FC 25 Ultimate Team
    • League of Legends
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • Switch 2
  • PS4
  • One
  • Switch
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Liste des sujets

[Aide] Probléme de menu...

zag39
zag39
Niveau 5
23 octobre 2009 à 20:43:09

Bonjour a tous. :)
Voila j'apprends grâce au tutoriel du "site du zéro" a créer un site web. http://www.siteduzero.com/tutoriel-3-13666-apprenez-a-creer-votre-site-web.html
Je suis arrivé presque a la fin du tuto, est la j'ai essayer de créer ma page web mais je rencontre un problème.
Je m'explique: en faite j'aimerai créer une page web qui ressemblerai a peu prés a ça http://www.noelshack.com//up/aac/0002447-f320427835.bmp
Je pensait que ça allait être simple mais j'ai eu un problème, soit je m'y suis mal pris soit je me suis trompé dans le code CSS. http://www.noelshack.com//up/aac/0002447-3663f2a940.bmp
La barre de menu et le menu de gauche sont collé est je n'arrive pas a les séparé. :(

Je met mon code css:
body
{
width: 760px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
background-image: url("images/fond.png"); /* Inactive */
background-color: black;
color: white;
}

  1. en_tete

{
width: 360px;
height: 200px;
background-image: url("images/banniere.jpg");
background-repeat: no-repeat;
margin: auto;
margin-bottom: 70px;
}

#menu1
{
width: 760px;
height: 52px;
background-image: url("images/fond_barre_menu.png");
background-repeat: repeat-x;

border: 3px solid white;
margin: 0px;
margin-bottom:80x;
}

.element_menu
{
text-align: center;
font-family: "Comic Sans MS", "Trebuchet MS", Georgia, serif;
margin: 0px;
margin-bottom:80x;
}

#menu2
{
float: left;
width: 120px;
border: 3px solid white;
}

.element_menu2
{
font-family: "Comic Sans MS", "Trebuchet MS", Georgia, serif;
}

Voila donc j'aimerai bien que quelqu'un m'aide a trouver ou j'ai fait une erreur.
Merci d'avance. :-)

Thymotep
Thymotep
Niveau 10
23 octobre 2009 à 20:55:50

Utilise la propriété CSS "float" sur tes blocks pour le menu 2 et la zone de texte

float:left; sur les deux, ou left sur le menu et right sur la zone de texte puis, en dessous, crée un div comme ceci

<div style="clear:both;"></div> pour annuler le floatement ou créer une class .clear { clear:both; } en CSS et met un class dans le div quoi :-)))

Thymotep
Thymotep
Niveau 10
23 octobre 2009 à 20:56:51

http://www.siteduzero.com/tutoriel-3-13566-mise-en-boite-partie-2-2.html#ss_part_2

Sur le SDZ :-)))

zag39
zag39
Niveau 5
23 octobre 2009 à 21:46:40

Je me suis trompé pour le deuxième lien je voulait mettre celui ci: http://www.noelshack.com//up/aac/pirahas-828e668856.bmp
J'ai encadré en rouge ce qui n'allait pas.

deepblue
deepblue
Niveau 16
24 octobre 2009 à 00:36:24

Syntaxe :
"80x; " --> "80px"

"margin: auto;
margin-bottom: VALEURpx;"
-->
"margin:auto auto VALEURpx auto;"

zag39
zag39
Niveau 5
24 octobre 2009 à 14:59:08

Merci beaucoup pour ta réponse, ca marche j'ai réussi a séparer les deux bloc. :-)
Il manquait juste p de "px". :hum:

Sous forums
  • Aide à l'achat Mac
  • Macintosh
  • Création de sites web
  • Création de Jeux
  • Linux
  • Programmation
  • Internet
  • Steam Deck
  • Hardware