[HTML/CSS] IE et Iframe [Résolu]

Erdnax, le lundi 12 septembre 2005 à 13:14:45

+1

Salut,

Essaye simplement de rajouter un width:100% dans le style de ton div.

@+
Grève de signure...

GallyNet, le lundi 12 septembre 2005 à 13:40:20

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.

Répondre à GallyNet

3

Erdnax, le lundi 12 septembre 2005 à 13:43:06

+1

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 :( Grève de signure...

Répondre à Erdnax

4

GallyNet, le lundi 12 septembre 2005 à 14:08:54

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.

Répondre à GallyNet

5

Erdnax, le lundi 12 septembre 2005 à 14:10:38

No problemo, j'ai moi aussi fais plusieurs boulettes sympa aujourd'hui lol.

@+
Grève de signure...

Répondre à Erdnax

6

GallyNet, le lundi 12 septembre 2005 à 15:21:21

+1

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:

<!--[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. :-)

Répondre à GallyNet

7

Erdnax, le lundi 12 septembre 2005 à 15:36:01

Ah, super astuce que je ne connaissais pas !
Grève de signure...

Répondre à Erdnax

8

GallyNet, le lundi 12 septembre 2005 à 15:48:41

Oui c'est assez pratique quand on doit faire quelque chose sous IE mais pas sous d'autre navigateur.
Par exemple il existe un même sorte de script qui exécute un javascript afin de rendre leurs transparence au images PNG sous IE.

Répondre à GallyNet

9

StreM, le lundi 12 septembre 2005 à 16:19:01

Cool !
Tu saurais me retrouver ca ?
^_^

Moins le blanc est intelligent, plus le noir lui parait bête

Répondre à StreM

10

GallyNet, le lundi 12 septembre 2005 à 17:43:27

+7

Pas de probleme :
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.

Répondre à GallyNet