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

Mise en page CSS Discussion :

Presque center verticalement un DIV ?


Sujet :

CSS

  1. #1
    Membre éclairé
    Profil pro
    Inscrit en
    Février 2007
    Messages
    749
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2007
    Messages : 749
    Par défaut Presque center verticalement un DIV ?
    Bonjour,

    quelque soit la taille d'une fenêtre, j'aurais besoin de centrer le contenu d'une page (dont je ne connais pas la hauteur) moins 100 pixels.

    Je suis une vraie bille en CSS, et je ne sais pas comment bien faire ça...


    Un petit coup de pouce serait très apprécié !
    PAul

  2. #2
    Inactif  

    Homme Profil pro
    développeur Vala
    Inscrit en
    Février 2011
    Messages
    478
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : développeur Vala
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Février 2011
    Messages : 478
    Par défaut
    Bonsoir .
    ce sera une réponse en javascript :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    document.getElementById(id_div).style.position = "absolute";
    document.getElementById(id_div).style.top = (window.innerHeight/2 - 100)+"px";

  3. #3
    Membre éclairé
    Profil pro
    Inscrit en
    Février 2007
    Messages
    749
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2007
    Messages : 749
    Par défaut
    Merci !


  4. #4
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    Citation Envoyé par rotrevrep Voir le message
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    document.getElementById(id_div).style.position = "absolute";
    document.getElementById(id_div).style.top = (window.innerHeight/2 - 100)+"px";
    window.innerHeight est non compatible avec IE < 9.

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
      oStyle.top = (( window.innerHeight ? window.innerHeight : document.body.clientHeight || document.documentElement.clientHeight)/2 - 100 )+"px";
    pour tenir compte de IE < 9 avec différents DOCTYPE

  5. #5
    Inactif  

    Homme Profil pro
    développeur Vala
    Inscrit en
    Février 2011
    Messages
    478
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : développeur Vala
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Février 2011
    Messages : 478
    Par défaut
    Citation Envoyé par NoSmoking Voir le message
    window.innerHeight est non compatible avec IE < 9.

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
      oStyle.top = (( window.innerHeight ? window.innerHeight : document.body.clientHeight || document.documentElement.clientHeight)/2 - 100 )+"px";
    pour tenir compte de IE < 9 avec différents DOCTYPE
    exact ! merci d'avoir corrigé

  6. #6
    Membre éclairé
    Profil pro
    Inscrit en
    Février 2007
    Messages
    749
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2007
    Messages : 749
    Par défaut
    Oui Merci.

    Mais entretemps j'avais tripatouillé aussi avec innerWidth. J'imagine que le problème est le même.
    J'ai répercuté tes modifications ainsi :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    = (( window.innerWidth ? window.innerWidth : document.body.clientWidth || document.documentElement.clientWidth)/2 - 100 )+"px";
    C'est bon ?
    Pas d'erreur ?

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. colonnes factices : centrer verticalement les DIV
    Par sebhm dans le forum Mise en page CSS
    Réponses: 11
    Dernier message: 18/02/2009, 11h11
  2. Center verticalement un DIV
    Par Clad3 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 12/01/2009, 09h56
  3. centrer verticalement un DIV en fonction du scroll
    Par discogarden dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 07/04/2008, 16h11
  4. Aligner verticalement un <div>
    Par Michaël dans le forum Balisage (X)HTML et validation W3C
    Réponses: 7
    Dernier message: 07/12/2005, 09h12

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