Rechercher : dans
Par :

Menu avec position:absolute

Dernière réponse le 30 aoû 2007 à 15:35:53 MasterOfQuebec, le 25 aoû 2007 à 17:52:43 
 Signaler ce message aux modérateurs

Bonjour,
J'essaie de faire un menu. J'ai fais un script javascript pour l'afficher. Mais j'ai un problème.
Le desing du site web est fais centré alors dès que je redimentione la fenêtre mes menus décales voici un exemple (ne portez pas attention a l'aspet du menu).

Voici comment le menu dois être :
http://rocksplash.com/img/onair.jpg

Mais voici comment le menu est quand je change la taille de la fenêtre :
http://rocksplash.com/img/onair2.jpg

Merci d'avance de votre aide.

Meilleures réponses pour « Menu avec position:absolute » dans :
Supprimer le lecteur média sur MySpace VoirProblème Comment supprimer le lecteur standard sur MySpace ? Solution Dans "Bio": embed{ visibility:visible; position:absolute; top:0; left:0; width:1; height:1; } Dans "Influences": Ligne de code pour le lecteur...
Comment créer une carte de menu de Noël VoirQuoi de plus "fashion" que de présenter une carte/un carton de menu de Noël ! Sympa, élégant, rigolo aussi, c'est selon ! Voici une petite astuce qui vous guidera dans votre création et... votre créativité ! Sommaire Choisir le menu de...
Réorganiser le menu Démarrer VoirAu fur et à mesure des diverses installations, le "Menu Démarrer" devient de plus en plus rempli et très mal organisé. Voilà comment procéder pour obtenir un menu organisé. Accéder au menu Démarrer Sous Vista, ce fichier est caché donc il faut...
Télécharger Menu Editor VoirMenu Editor est une extension de Firefox qui permet de définir les éléments du menu contextuel : Activer/Désactiver des entrées dans le menu ; Positionner les éléments dans le menu. Regardez ici pour plus d'informations : Personnaliser les...
Positionner des éléments grâce aux CSS VoirIl est possible grâce aux feuilles de style de positionner au pixel près du texte ou des images grâce aux balises et . Cela est possible avec les versions 4 de Netscape et d'Internet Explorer, cependant cette technique reste hasardeuse...
Windows 7 - Barre des tâches et menu démarrer VoirLA BARRE DES TACHES ET LE MENU DEMARRER Cet élément clé du Bureau de Windows est situé en bas de l’écran, sur toute sa largeur. C’est l’un des aspects du système qui a le plus évolué entre Windows Vista et Windows 7. Pour commencer, elle est plus...
DHTML - La notion de couche VoirQu'est-ce qu'une couche? Le DHTML est basé sur une fonctionnalité provenant de la norme 4.0 du HTML: les feuilles de style en cascade de positionnement, aussi appelée CSS-P (Cascading Style Sheets Positionning). Celles-ci permettent de définir des...

1

Gihef, le 25 aoû 2007 à 18:43:51

Bonjour,

Pour que “absolute” fonctionne comme tu le veux, il faut qu'il puisse le faire relativement au bloc qui contient les images de menu.
Il faut donc que tu “position : relative;” ce bloc.

Répondre à Gihef

2

MasterOfQuebec, le 28 aoû 2007 à 00:46:23

Merci mais sa na pas marché.
J'ai alors mis le div de mon menu (avec les liens) dans la div ou sont les boutons puis je l'ai mis en absolu et j'ai jouer avec : margin-top et margin-left.
Jusque là tout allais bien. Puis j'ai testé sour Internet Explorer, le désastre. Le menu n'est pas positioné à la même endroit.

Voici une capture sous firefox :
http://rocksplash.com/img/diff.jpg
Et voici une capture sous Internet Explorer :
http://rocksplash.com/img/diff2.jpg

Et voici le code :

<div id="menu-boutons"><div id="partenaires" style="position:absolute; height:auto; width:125px; display:none; background-color:#0066FF; margin-top: 20px; margin-left: 237px;">
<a href="lien.php">Lien</a><br />
    <a href="lien.php">Lien</a><br />
    <a href="lien.php">Lien</a><br />
    <a href="lien.php">Lien</a>
</div>
Les boutons ICI...
</div>

Répondre à MasterOfQuebec

3

Gihef, le 28 aoû 2007 à 13:54:55

Bon.
Elles sont jolies tes copies d'écran, mais on ne peut rien en faire.
Du code, complet, la page et le CSS, ou mieux, l'adresse de la page seraient beaucoup plus utiles.

Sinon on va (ou plutôt, on ne va pas) continuer à discuter dans le vide.

--

Répondre à Gihef

4

MasterOfQuebec, le 29 aoû 2007 à 20:22:00

Alors voici l'url vers le site : http://www.rocksplash.com/ph/index3.php
Avoir la source n'est pas difficile.

Répondre à MasterOfQuebec

5

Dalida, le 29 aoû 2007 à 20:55:58

Salut,

j'ai regardé vite fait.
je pense qu'il faut déplacer ça :

<div id="partenairess" style="position: absolute;
              left: 67px;
              top: 128px;
              width: 107px;
              height: 61px;
              border-top: 1px solid red;
              border-left: 1px solid red;
			  display: block;">Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu</div>

dans '<div id="conteneur">.
et modifier cette règle :
div#conteneur {

margin-left : auto;

margin-right : auto;

width : 833px;

text-align : left;

position: relative;

}
[ Mathieu ]
Il y a surement des pandas pour ne dépendre de rien

Répondre à Dalida

6

MasterOfQuebec, le 29 aoû 2007 à 23:32:54

J'ai fais ce que tu as dis et sa na rien changer.
Merci quand même.

Répondre à MasterOfQuebec

7

Gihef, le 29 aoû 2007 à 23:44:23
  • +1

C'est vrai qu'il a répondu rapidement (-;

Mais c'est ce qu'il faut faire.

Pourquoi coller le menu tout en bas du document HTML en dehors du conteneur alors qu'il est sensé s'afficher en haut et dedans ?

Il faut donc “déplacer ça”, par exemple, ici

<div id="conteneur"><img src="images/header.png" alt="Puissancehits">
  <div id="partenairess" 
       style="position: absolute;
              left: 67px;
              top: 128px;
              width: 107px;
              height: 61px;
              border-top: 1px solid red;
              border-left: 1px solid red;
              display: block;">
  Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu Menu
  </div>	
  <div id="menu-boutons">
et puis
div#conteneur {
  position : relative;
  margin : 0 auto;
  width : 833px;
  text-align : left;
  }
Il ne reste que quelques réglages à faire.


+ Pour quelques jours.

Répondre à Gihef

8

 MasterOfQuebec, le 30 aoû 2007 à 15:35:53
  • +1

Merci beaucoup sa marche.

Répondre à MasterOfQuebec