[HTML/CSS] IE et Iframe
Résolu
GallyNet
Messages postés
434
Date d'inscription
Statut
Membre
Dernière intervention
-
GallyNet Messages postés 434 Date d'inscription Statut Membre Dernière intervention -
GallyNet Messages postés 434 Date d'inscription Statut Membre Dernière intervention -
J'ai un énorme problème et j'arrive décidemment pas à trouver une solution :
j'ai créer une page avec un div qui contient une iframe. Je fait que la div soit à 20 pixel du bord et que sont contenu soit à 10px de la div. L'Iframe doit avoir une taille de 100%.
Aucun problème sous firefox, tout marche correctement (normal me dirai vous), mais quand je test sous IE j'ai mon ifrmae qui dépasse de ma div et même de ma page. Par contre, si je redimmensionne la fenètre de IE, l'iframe pred automatiquement la bonne taille (?) mais si je recharge la page, l'iframe sort à nouveau de la div (???).
Est-ce que quelqu'un à déjà eu se probléme et pour me dire coment il a réussi à corrigé celà ? Ou il y aurait-il quelqu'un qui aurait une idée pour que celà marche ?
Merci d'avance.
Voici mon code :
j'ai créer une page avec un div qui contient une iframe. Je fait que la div soit à 20 pixel du bord et que sont contenu soit à 10px de la div. L'Iframe doit avoir une taille de 100%.
Aucun problème sous firefox, tout marche correctement (normal me dirai vous), mais quand je test sous IE j'ai mon ifrmae qui dépasse de ma div et même de ma page. Par contre, si je redimmensionne la fenètre de IE, l'iframe pred automatiquement la bonne taille (?) mais si je recharge la page, l'iframe sort à nouveau de la div (???).
Est-ce que quelqu'un à déjà eu se probléme et pour me dire coment il a réussi à corrigé celà ? Ou il y aurait-il quelqu'un qui aurait une idée pour que celà marche ?
Merci d'avance.
Voici mon code :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
</head>
<body>
<div style="padding:10px;margin:20px;border:solid red 1px;">
<iframe style="width:100%;">
</iframe>
</div>
</body>
</html>
A voir également:
- [HTML/CSS] IE et Iframe
- Editeur html - Télécharger - HTML
- Ie tab - Télécharger - Outils pour navigateurs
- Bill ie cork ✓ - Forum Consommation & Internet
- Espace en html ✓ - Forum HTML
- Www.youtube.com n'autorise pas la connexion. iframe ✓ - Forum HTML
7 réponses
Pas de probleme :
dans t'on code HTML tu pose le code suivant dans t'on en-tete:
Il exécutera le code que si le navigateur est IE 5.5 ou supérieur.
Ensuite tu créer un fichier "pngfix.js" qui contient le code suivant :
Et techniquement tout doit marcher.
dans t'on code HTML tu pose le code suivant dans t'on en-tete:
<!--[if gte IE 5.5000]> <script type="text/javascript" src="pngfix.js"></script> <![endif]-->
Il exécutera le code que si le navigateur est IE 5.5 ou supérieur.
Ensuite tu créer un fichier "pngfix.js" qui contient le code suivant :
// Correctly handle PNG transparency in Win IE 5.5 or higher. // http://homepage.ntlworld.com/bobosola. Updated 02-March-2004 function correctPNG(){ for(var i=0; i<document.images.length; i++){ var img = document.images[i] var imgName = img.src.toUpperCase() if (imgName.substring(imgName.length-3, imgName.length) == "PNG"){ var imgID = (img.id) ? "id='" + img.id + "' " : "" var imgClass = (img.className) ? "class='" + img.className + "' " : "" var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' " var imgStyle = "display:inline-block;" + img.style.cssText if (img.align == "left") imgStyle = "float:left;" + imgStyle if (img.align == "right") imgStyle = "float:right;" + imgStyle if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle var strNewHTML = "<span " + imgID + imgClass + imgTitle + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";" + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader" + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" img.outerHTML = strNewHTML i = i-1 } } } window.attachEvent("onload", correctPNG);
Et techniquement tout doit marcher.
Désolé, mais même avec un width:100% dans la div, il n'y a aucun changement.
A la limite, s'il y aurait un script javascript qui prendrai la taille en pixel de la div et l'appliquerai à l'iframe avec 20 pixel de moins se serait génial, mais je mis connais pas trops en javascript.
A la limite, s'il y aurait un script javascript qui prendrai la taille en pixel de la div et l'appliquerai à l'iframe avec 20 pixel de moins se serait génial, mais je mis connais pas trops en javascript.
Ah, pourtant quand je test en local chez moi ton code, ça fait bien ce que tu dis, au redimmentionnement aussi, et lorsque je rajoute le width dans le div, tout fonctionne... c'est bizard.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
</head>
<body>
<div style="width:100%;padding:10px;margin:20px;border:solid red 1px;">
<iframe style="width:100%;">
</iframe>
</div>
</body>
</html> Ca donne ça, et ça marche :(
Oulalala, excuse moi, j'avais pas mis width:100% mais style:100%
La honte sur moi.
effectivement en maitant le width:100% tout marche très bien. Je te remercie bien et j'espere ne plus faire d'erreur aussi stupide.
La honte sur moi.
effectivement en maitant le width:100% tout marche très bien. Je te remercie bien et j'espere ne plus faire d'erreur aussi stupide.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
En fait, j'ai re-regardé tout ca est malheureusement, dans le vrai code que j'utilise (j'avais donné une version soft) j'ai un nouveau problème avec Firefox : le div principal prend une taille de 100% de la taille de la fenetre, alors avec une margin de 20 pixel et un padding de 10 pixel, elle dépasse donc de 30 pixel sur la droite.
Heureusement IE possede un systeme de script intégré qui permet de corrigé les bug horrible qu'il ocasionne. J'ai donc rajouté le code suivant:
Où le fichier ie.css contient le width:100%
Comme IE l'exécute, il a donc la taille correcte, et comme firefox ne l'éxécute pas, il a également la taille correct. :-)
Heureusement IE possede un systeme de script intégré qui permet de corrigé les bug horrible qu'il ocasionne. J'ai donc rajouté le code suivant:
<!--[if IE]> <link rel="stylesheet" href="style/ie.css" type="text/css" /> <![endif]-->
Où le fichier ie.css contient le width:100%
Comme IE l'exécute, il a donc la taille correcte, et comme firefox ne l'éxécute pas, il a également la taille correct. :-)
