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 :

height: 100%, possible ou non ?


Sujet :

CSS

  1. #1
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    46
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 46
    Points : 34
    Points
    34
    Par défaut height: 100%, possible ou non ?
    bonjour,
    Je débute plus ou moins en css, j'ai fait un site, et à un endroit j'aimerai qu'un div occupe tout l'espace vertical qui lui reste. En effet ce dernier se trouve dans un conteneur qui est en float:right qui flotte donc à droite d'un autre conteneur. Le conteneur de gauche est souvent plus long que celui de droite. Je souhaite completter l'espace restant. Une image sera surement plus claire que mes explications :



    Merci...

  2. #2
    Membre émérite
    Avatar de Candygirl
    Femme Profil pro
    Inscrit en
    Juillet 2006
    Messages
    1 912
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 51
    Localisation : Suisse

    Informations forums :
    Inscription : Juillet 2006
    Messages : 1 912
    Points : 2 907
    Points
    2 907
    Par défaut
    Hello,

    Selon les spécifications css, la hauteur en % d'un bloc ne s'applique que si son parent a une hauteur renseignée.

    La seule solution consiste donc à donner une hauteur depuis la balise html, dont le 100% équivaudra à la taille de la fenêtre, puis au body, ... Le problème est que, si ton contenu dépasse en hauteur la taille de ta fenêtre, le conteneur, lui s'arrêtera à 100%, soit à la taille de la fenêtre. Tu peux donner alors un min-height de 100% pour le conteneur en question, mais il n'y aura alors plus de height et donc les enfants ne pourront pas recevoir de height en % (donner un height en % quand le parent n'a aps de hauteur renseignée revient à donner un height:auto)

    Bref, une solution actuelle facile à mettre en oeuvre serait de donner une image de fond grise qui se répète en y a un élément qui contient à la fois ton menu et ton contenu (d'après ton screen à l'élément qui possède le border).
    Les bons réflexes:
    • avant de poser une question:
      règles | faq | tutoriels | recherche
    • clarté, politesse, vocabulaire et orthographe soignés = efficacité
    • remercier ceux qui ont pris le temps d'aider et si c'est le cas

  3. #3
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    46
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 46
    Points : 34
    Points
    34
    Par défaut La vérité est ailleurs
    Grace à ton aide sur le bug des 3px de float je peux maintenant utiliser la couleur de fond de mon conteneur principal à cet effet... Merveilleux non ?

  4. #4
    Membre émérite
    Avatar de Candygirl
    Femme Profil pro
    Inscrit en
    Juillet 2006
    Messages
    1 912
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 51
    Localisation : Suisse

    Informations forums :
    Inscription : Juillet 2006
    Messages : 1 912
    Points : 2 907
    Points
    2 907
    Par défaut
    Citation Envoyé par Givemefive
    je peux maintenant utiliser la couleur de fond de mon conteneur principal à cet effet... Merveilleux non ?
    Il faut juste penser au cas où ton conteneur de droite est plus long que le gauche. Acceptes-tu alors d'avoir du gris en-dessous ? Si oui, une couleur de fond suffit, autrement un min-height (mais qui peut varier dans le futur si ta colonne de droite s'allongeait = pas très fonctionnel) sur ton élément de gauche ou alors une image de fond (avec peut s'avérer utile
    Les bons réflexes:
    • avant de poser une question:
      règles | faq | tutoriels | recherche
    • clarté, politesse, vocabulaire et orthographe soignés = efficacité
    • remercier ceux qui ont pris le temps d'aider et si c'est le cas

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

Discussions similaires

  1. [MSIE] height=100% non pris en compte
    Par yjuliet dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 28/09/2007, 09h55
  2. Réponses: 4
    Dernier message: 12/10/2005, 16h13
  3. [css]opéra height 100% absolute
    Par spirou dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 08/10/2005, 22h10
  4. [W3C] height="100%" différent de style="height:100%
    Par Oluha dans le forum Balisage (X)HTML et validation W3C
    Réponses: 8
    Dernier message: 18/08/2005, 17h14
  5. [HTML] Height à 100% sur Img sous IE
    Par lord_paco dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 10/08/2005, 11h04

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