12
votes

iframe ne se développe pas à 100% de hauteur

J'ai ceci ci-dessous HTML. Et j'aimerais que l'IFrame couvre le reste de l'écran avec 100% sur tout ce qui reste. J'ai essayé "100%" et "*" en height attribut mais ne fonctionne pas. Pourquoi donc? Merci xxx


0 commentaires

3 Réponses :


1
votes

Ce CSS devrait faire le tour pour vous: xxx

puis réglez la hauteur de l'iframe à 96%. Cela l'empêchera d'être enfoncé du bas de la page.

La raison dont vous avez besoin est que la hauteur de 100% sur l'IFrame est calculée à 100% de la hauteur de l'écran disponible. Depuis que vous avez un hauteur de 35px DIV au-dessus de l'iframe, vous vous retrouvez avec un iframe poussé 35PX au-delà de la hauteur totale de l'écran.


2 commentaires

J'ai toujours un problème. Le site Web est ici si vous voulez le voir web.kucku.vn/u/d


Oui, cela a fonctionné pour moi. Mon MAIN.HTML a deux cadres, Navigate.html et content.html. J'ai utilisé au-dessus de CSS pour le corps principal.html, et cela a fonctionné.



18
votes

La taille de la raison: 100% ne fonctionne pas est parce que% de hauteurs ne fonctionnent pas sur les enfants dont les parents n'ont pas de hauteur explicite (non%). Donc, cela ne fonctionne pas: xxx

tandis que cela fonctionne: xxx

enfant ne sait pas ce que 60% signifie, donc à la place de la hauteur : Auto (hauteur déterminée par le contenu statique à l'intérieur).

enfant sait comment comprendre un% de 60em ou toute autre unité explicite.

Il y a quelques exceptions à cet effet régner. On est là où lorsque les éléments HTML et Body sont donnés de hauteur: 100%, vous pouvez utiliser la hauteur: 100% ou min-hauteur: 100% sur un enfant direct. (Vous pouvez essayer la taille: 96% en tant que PAT suggéré mais sachez que cela sera une valeur complètement différente par écran / hauteur du navigateur. À des tailles inattendues, vous pouvez perdre du contenu.)

Sauf maussade sur le HTML, On dirait que vous avez deux enfants directs: l'iframe et le cadre de conteneur #.

Vous pouvez essayer de positionnement absolument # Cadre de conteneur en haut de la fenêtre (il peut donc s'asseoir au-dessus du reste de la page, et par "ci-dessus, je veux dire" plus proche de l'utilisateur sur le z- Axis "), et si l'IFrame n'est pas réglé à 100% élevé mais peut-être comme l'exemple de Pat, 96% ou quelque chose, vous pourriez peut-être donner à l'iframe un peu de rembourrage supérieur pour rendre la salle visuelle pour # Conteneur. Si vous ne le faites pas, le sommet de l'iframe serait obscurci par # Conteneur-Cadre et que les gens manquaient le sommet. Sachez que vous ne pouvez pas ajouter de marges supérieures ou inférieures, rembourrage, frontières, etc. à une boîte 100% élevée. Cela vous donnerait quelque chose de plus de 100%!

Une autre exception à la règle% Hauteur est avec des éléments absolument positionnés en général. Ils peuvent également avoir une hauteur de%, à l'exception de IE6 a des problèmes avec cela. Donc, éventuellement positionnement absolument, les deux enfants directs peuvent fonctionner, si cela ne vous dérange pas de pirater pour IE6 ou ne vous souciez pas de IE6. Généralement, je n'aime pas tout positionnement sur une page, mais cela pourrait être plus facile dans un cas comme celui-ci.


1 commentaires

@Brabbeldas la largeur et la hauteur se comportent intrinsèquement différente. Ce n'est rien de plus que mon premier devin, mais je dirais que le navigateur a la capacité de déterminer la largeur totale de la page (soit par la limite de visualisation ou un réglage plus large explicite), mais la hauteur augmentera au besoin et, par conséquent, sauf indication contraire, sauf si Le navigateur ne peut pas savoir ce que 100% signifie



0
votes

Vous pouvez essayer simplement d'utiliser code> au lieu de


1 commentaires

Ce dernier code a fonctionné, bien que certaines pages nécessitaient l'enveloppant dans une sécurité.