28173 sujets

CSS et mise en forme, CSS3

[Résolu] Décalage de contenu a l'intérieur de mon iframe.

Rebonsoire tout le monde. J'ais creusé un peu et mon problème de scrollbar venai du fait que j'avais placé mon image dans un div de 100% sur 100 et dans un autre div faisant la taille de mon image (500x500 en margin:auto)... Smiley biggrin


Cependant, il me reste toujour un problème
-1 Le premier: décalage du contenu a l'intérieur de mon iframe, sous firefox et IE.

CSS:

body
{
overflow:hidden;
overflow-x: hidden;
overflow-y: auto;
overflow : -moz-scrollbars-vertical;
background-color:#313131;
font-size:11px;
color:#313131;
font-family:Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-weight:bold;
}
a img{border:none;text-decoration:none;}
a{text-decoration:none;color:#167587;}
a:hover{color:silver;}

#iframe
{
width:700px;
background-color:#313131;
overflow:hidden;
border:1px solid white;
}

.bouton2:hover{height:auto;}
.sousbouton a{text-decoration:none; color:#167587;}
.sousbouton a:hover{color:silver;}
.sousbouton
{
background-color:#313131;
font-size:11px;
}

.gallerie
{
border:1px solid red;
position:relative;
top:0px;
left:0px;
width:700px;
margin:auto;
background-color:#313131;
}


HTML de la page principal:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>aREA-51</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <link rel="shortcut icon" type="image/x-icon" href="area.ico" />
	   <script>
function actu_iframe(){
if(navigator.appName=="Microsoft Internet Explorer" ){
if(document.all) document.all.id_iframe.style.height = document.frames("iframe" ).document.body.scrollHeight;
else document.getElementById("iframe" ).style.height = document.getElementById("iframe" ).contentDocument.body.scrollHeight;
}
else{
document.getElementById("iframe" ).style.height = document.getElementById("iframe" ).contentDocument.body.offsetHeight+"px";
}
}
</script>	   
<!--[if lt IE7]>
				<script>
				function actu_iframe()
{
if(document.all) document.all.iframe.style.height = document.frames("iframe" ).document.body.scrollHeight;
else document.getElementById("iframe" ).style.height = document.getElementById("iframe" ).contentDocument.body.scrollHeight;
}
</script>
		<![endif]--> 
<link rel="stylesheet" media="screen" type="text/css" title="clearblack" href="hithesky.css"/>
   </head>
   
<body> 

<div class="frame">
		<iframe onLoad="actu_iframe();" name="I1"id="iframe" src="index/+.html" scrolling="no" frameborder=no>Votre navigateur ne supporte pas les 
		frames.</iframe>
		</div>

<a id="menulien" href="info/info.html" target="I1">
		<div class="bouton2">
			aREA-51
		</div>
		</a>


HTML d'une page contenant un image (contenu décalé dans l'iframe):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>BLOC-418²</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <link rel="stylesheet" media="screen" type="text/css" title="clearblack" href="../../hithesky.css"/>
	   <link rel="shortcut icon" type="image/x-icon" href="area.ico" />
   </head>
   <body>
		<div class="gallerie">
		<img src="+2.jpg"/>
		</div>
	</body>
</html>


Je pense que ce problème de décalage a un rapport avec l'image et sont div conteneur.... help pleas. Merci d'avance! Smiley cligne
Modifié par Stickmaniak1 (20 Jun 2007 - 10:20)
Bonjour,

Merci de choisir un titre reflétant le problème que tu rencontres. Tu peux modifier le titre du sujet en utilisant le bonton "éditer".
Je post une image pour que se soit plus claire:

- La marge rouge représente la div gallerie qui contient l'image.
C'est la page qui est charger dans mon iframe.
- La marge blanche représente l'iframe.

Il y a bel et bien un décalage, sous IE comme sous FF.

Smiley decu Up pleas...

PS:désolé pour l'image trops grande.
Modifié par Stickmaniak1 (20 Jun 2007 - 10:20)
C'est pas les marges internes ou externes sur le html ou le body de la frame chargée? Ou sinon un problème de fusion des marges (marges par défaut d'un hn par exemple qui se transmets à son conteneur).
MERCI Nicoles!!!! Smiley biggrin .
Merci, tu as raison, j'ais appliqué margin:0px; et padding:0px a mon body et tout est rentré dans l'ordre (quand on y pense c'est tout bète...) Smiley lol
Bonne journée a tous!
Sujet clos
Aller à