28173 sujets

CSS et mise en forme, CSS3

[Résolu] Adapter la hauteur d'une table par rapport a la fenetre

Pages :
Bonjour,
sur mon code, la table a pour taille des %,
c'est a dire

table {
	width: 80%;
	max-width: 1200px;
	min-width: 800px;
	height: 55%;
	max-height: 700px;
	min-height: 450px;
}


Malheureusement, la table ne change pas de hauteur Smiley decu .

Je ne sais pas si c\est la faute du navigateur ou pas (Google Chrome)

PS: desole pour les accents manquants
si tu mets
width: 80%;
ta table sera toujours à 80% de la largeur de l’élément parent.. est-ce clair pour toi ?
L’élément parent c'est la page en elle même, c'est à dire <body>.
J’imagine que sa taille change quand la fenêtre change de taille.
Cela ne marche qu'avec le <width> mais pas avec le <height> malgré le changement de taille.
Bonjour SebPap,

il faut que tu définisses une hauteur à tous les éléments parents pour que sa fonctionne. Dans ton cas, si l'élément parent est la balise <body></body>, alors essaye de mettre ça :

html
{
    height: 100%;
}

body
{
    height: 100%;
}

table
{
    height: 55%;
}


ça devrait fonctionner ! Smiley cligne
Modifié par Nekipic (19 Apr 2016 - 14:36)
Désolé mais cela n'as pas marché.
De toute façon, la balise <body> n'avait pas de largeur définie non-plus, et pourtant, la table s’élargissait.

J'essaye de trouver et merci pour vos réponses/futures réponses. Smiley cligne
Re, j'ai édité mon premier message car j'avais oublié de préciser qu'il faut également définir la hauteur de l'élément <html></html> par une height: 100%;

L'as-tu pris en compte lors de ton essai ?
Non je suis désolé,
mais ce n'est pas grave.
je pense qu'il sagit d'une erreur dans le code a un endroit.
Tant pis et merci Smiley cligne
recopie ton code ici, run tester et save pour nous envoyer l'url pour que l'on puisse tester également.
Modifié par JENCAL (19 Apr 2016 - 15:02)
Ok merci,

Si tu enleve width: 80%; ta table sera toujours compris entre 800px minimum et 1200px maximum (suivant son contenu), et tu laisse uniquement width: 80%; ta table sera toujours égale à 80% de la largeur de son conteneur.
Donc là tu mélange les deux... c'est pas clair.. je ne comprend pas où tu veux en venir. peut être en réexpliquant mieux ton problème.

Concernant le height, la manière de fonctionner reste la même chose.
Tu veux que la table "change" de hauteur, comment t'y prends tu pour tester ce changement ?
Modifié par JENCAL (19 Apr 2016 - 15:38)
Pour le Width, je souhaite que ma table ne soit pas plus petite que 800px et plus grand que 1200px, donc après ces valeur, ma table ne change pas de taille. Meme principe pour la hauteur.
Ma table ne change pas sa hauteur lorsqu'elle devrait le faire.

Mais j'essaye une méthode complètement différente en ce moment.
SebPap a écrit :
Ma table ne change pas sa hauteur lorsqu'elle devrait le faire.

Mais j'essaye une méthode complètement différente en ce moment.


Ok il vaut mieux que tu essayes car là c'est n'importe quoi dans le lien que tu m'a donner sur le jsfiddle. y'a du height 60% inline html y'a du min / max sur du % dans le css... tiens nous au courant si tu as des problème sur ta nouvelle manière de faire.

Mais je n'ai toujours pas compris ton problème, si tu souhaite adapter la hauteur au contenu ou au conteneur (ou a la fenêtre)
C'est bon j'ai résolu le problème, qui à la base venait d'un autre a propos d'une iframe.
Je résous et je vous envoie le lien Smiley cligne .
Merci encore. Smiley smile

PS: c’était a la fenêtre.
Modifié par SebPap (19 Apr 2016 - 16:02)
Pages :
Sujet clos
Aller à