Dimension balise <object> [Résolu]

fleto · 23/03/2011, 23h25

Bonjour,

Ca fait pas longtemps que j'apprends le html et je ne comprends pas encore certaines choses.
Voici ma question.

J'utilise la dtd xtml 1.0 stric.
Dans ma page html j'utilise juste la balise <object> qui me permet d'incorporer une autre page web dans mon site.

J'ai dimensionné la taille dans un fichier css avec width et height.

Sous google chrome cela fonctionne bien mais quand je teste sous firefox la hauteur de la balise pose probleme. Firefox n'affiche pas la bonne taille.

Voici la page xhtml

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
<!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>Mon site</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <link rel="stylesheet" media="screen" type="text/css" title="DesignPage3" href="designPageHtml.css" />
   </head>
   <body>
		<!-- web page -->
		<p >
			<object id="webpage" data="http://fr.wikipedia.org/wiki/Hypertext_Markup_Language" type="text/html">
			  impossible to display the web page !
			</object>
		</p>
   </body>
</html>

voici le css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
#webpage
{
	width: 80%;
	height:70%;
	border: 2px solid black;
}

Merci d'avance!!

bob633 · 24/03/2011, 12h37

Essai directement de mettre les balises dans la balise object sans passer par le style css :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<object id="webpage" data="http://fr.wikipedia.org/wiki/Hypertext_Markup_Language" type="text/html" width="x px" height="x px">
			  impossible to display the web page !
			</object>

fleto · 24/03/2011, 14h34

J'ai essayé de faire comme vous avez dit mais cela ne fonctionne pas.
En revanche j'ai essayé de mettre des px au lieu des %. Et ca change bien ma taille. Mais dans mon cas je voudrais que mon design soit extensible.

thelvin · 24/03/2011, 15h04

Si tu mets height: 70% sur #webpage, ça veut dire 70% de la hauteur occupée par le <p> qui le contient.

Si par hasard la hauteur de <p> n'est spécifiée nulle part, ça veut dire que le pourcentage est ignoré et que la hauteur redevient automatique.
Apparemment le traitement automatique de Chrome s'approche de ce que tu voulais. C'est sans doute un hasard.

Ce que tu veux, c'est un truc genre body => 100%, p => 70%, object => 100%.

fleto · 24/03/2011, 22h02

Merci pour cet éclaircissement.
J'ai essayé ce que tu m'as conseillé mais cela ne fonctionne pas plus.
Sous Google chrome cela marche toujours, mais sur firefox la hauteur ne s'affiche pas correctement.

Les changements du code:
J'ai défini un id dans la balise p (pObject)

fichier CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
#pObject
{
	width: 80%;
	height:70%;
}
#webpage
{
	width: 100%;
	height:100%;
	border: 2px solid black;
}

thelvin · 25/03/2011, 13h54

Tiens, après test, il semble en effet que Firefox soit un peu intransigeant sur la question "80% de quoi ?"

Il faut indiquer height: 100% sur tous les blocks parents de <p>.
Autrement dit, sur <body> et <html> aussi. (Honnêtement, pour <html>, ça me paraît pas la meilleure interprétation des recommandations CSS. Mais bon.)

fleto · 25/03/2011, 20h23

Ca marche!!

Merci pour explication. Un peu bizarre tout de même de faire ca.

24/03/2011, 14h34	#3
fleto Futur Membre du Club Florian Le Touzé Étudiant Inscription : avril 2010 Messages : 32 Détails du profil Informations personnelles : Nom : Florian Le Touzé Informations professionnelles : Activité : Étudiant Informations forums : Inscription : avril 2010 Messages : 32 Points : 15 Points : 15	J'ai essayé de faire comme vous avez dit mais cela ne fonctionne pas. En revanche j'ai essayé de mettre des px au lieu des %. Et ca change bien ma taille. Mais dans mon cas je voudrais que mon design soit extensible.
	00

24/03/2011, 15h04	#4
thelvin Expert Confirmé Sénior Inscription : septembre 2004 Messages : 5 064 Détails du profil Informations forums : Inscription : septembre 2004 Messages : 5 064 Points : 6 981 Points : 6 981	Si tu mets height: 70% sur #webpage, ça veut dire 70% de la hauteur occupée par le <p> qui le contient. Si par hasard la hauteur de <p> n'est spécifiée nulle part, ça veut dire que le pourcentage est ignoré et que la hauteur redevient automatique. Apparemment le traitement automatique de Chrome s'approche de ce que tu voulais. C'est sans doute un hasard. Ce que tu veux, c'est un truc genre body => 100%, p => 70%, object => 100%.
	00

25/03/2011, 13h54	#6
thelvin Expert Confirmé Sénior Inscription : septembre 2004 Messages : 5 064 Détails du profil Informations forums : Inscription : septembre 2004 Messages : 5 064 Points : 6 981 Points : 6 981	Tiens, après test, il semble en effet que Firefox soit un peu intransigeant sur la question "80% de quoi ?" Il faut indiquer height: 100% sur tous les blocks parents de <p>. Autrement dit, sur <body> et <html> aussi. (Honnêtement, pour <html>, ça me paraît pas la meilleure interprétation des recommandations CSS. Mais bon.)
	00

25/03/2011, 20h23	#7
fleto Futur Membre du Club Florian Le Touzé Étudiant Inscription : avril 2010 Messages : 32 Détails du profil Informations personnelles : Nom : Florian Le Touzé Informations professionnelles : Activité : Étudiant Informations forums : Inscription : avril 2010 Messages : 32 Points : 15 Points : 15	Ca marche!! Merci pour explication. Un peu bizarre tout de même de faire ca.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email