IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Positionner un élément à coté d'une navbar


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre très actif Avatar de Cvanhove
    Homme Profil pro
    Concepteur Développeur Informatique
    Inscrit en
    Septembre 2014
    Messages
    174
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 31
    Localisation : France, Deux Sèvres (Poitou Charente)

    Informations professionnelles :
    Activité : Concepteur Développeur Informatique

    Informations forums :
    Inscription : Septembre 2014
    Messages : 174
    Par défaut Positionner un élément à coté d'une navbar
    Bonjour,

    J'ai une navbar (<nav> ) positionner sur la gauche de l'écran. J'ai un tableau que je souhaite mettre le plus grand possible sur ma page, je veux donc que celui ci commence coller à ma navbar.
    Le problème est quand je met width:100% il ignore ma navbar et commence en dessous de celle ci.
    Y-a-t-il une astuce en html/css?

    Cordialement

  2. #2
    Membre expérimenté
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2015
    Messages
    98
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Seine et Marne (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2015
    Messages : 98
    Par défaut
    Bonjour,

    C'est que ta navbar doit être en position absolute.
    Tu peux essayer de mettre un div de 100% avec un padding-right de x pixels (x étant la largeur de ta navbar).
    Puis dans ce div tu mets ton tableau avec un largeur de 100%;
    Il faut alors utiliser le border-box sur le premier div.
    Voici un exemple pour illustrer avec que des divs.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <!DOCTYPE html>
    <html>
      <head>
      </head>
      <body style="margin: 0; padding: 0">
        <div id="navbar" style="position: absolute; top: 0; left: 0; height: 100px; width: 20px; background-color: blue; z-index: 5"></div>
        <div id="fullScreen" style="width: 100%; height: 110px; box-sizing: border-box; background-color: yellow; padding-left: 20px;">
          <div id="table" style="width: 100%; height: 105px; background-color: orange;">
          <div>
        </div>
      </body>
    </html>

Discussions similaires

  1. Positionner les éléments d'une inteface
    Par hend_ba dans le forum Android
    Réponses: 1
    Dernier message: 27/03/2013, 13h37
  2. Réponses: 11
    Dernier message: 15/10/2010, 12h43
  3. Positionner des éléments de formulaire sur une grille
    Par Jiyuu dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 24/08/2009, 16h49
  4. Positionner des éléments dans une cellule de tableau
    Par Rémy29 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 31/07/2006, 17h33
  5. couleurs des éléments 3D d'une appli
    Par Eugénie dans le forum MFC
    Réponses: 29
    Dernier message: 12/03/2004, 11h31

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo