28221 sujets

CSS et mise en forme, CSS3

Bonjour,
J'ai une page avec une image souvent large et je voudrais imprimer juste cette image en paysage. Pour cela j'ai fais une CSS spéciale pour l'impression.

Sous FireFox tout va bien, par contre sous IE elle s'imprime en portrait comme si IE ignorait
@page { 
	size: auto;
}


Ma page web :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
		<title>Volumes Mensuels</title>
		<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />		
		<style type="text/css" media="screen">@import url(xforms.css);</style>
		<style type="text/css" media="screen">@import url(graph.css);</style>
		<style type="text/css" media="print">@import url(print.css);</style>

		<script type="text/javascript" src="fonctions/js/datePicker.js"></script>
		<script type="text/javascript">
			<!--
				var bBig = false;
				function Resize(AObject)
				{
					if (bBig == true)
					{
						AObject.className = "graph";
						bBig = false;
					}
					else
					{
						AObject.className = "graphAuto";
						bBig = true;
					}
				}
			-->
		</script>
	</head>
	<body>
		<form id="frmVolumesMensuels" method="post" action="VolumesMensuels.asp">
		<!-- le contenu de mon form -->
		</form>
		<div>
			
				<a class="print" href="javascript:print();"><img src="images/print.png" alt="Imprimer" /></a>
				<img class="graph" src="GraphVolumesMensuel.asp?client=00000&amp;centre=000&amp;poste=0&amp;datedeb=20/09/2004&amp;datefin=30/11/2004" alt="graphique" onclick="Resize(this);" />
			
		</div>
	</body>
</html>


le feuille de style d'impression :

@page { 
	size: auto;
}
#frmVolumesMensuels, .print {
	display: none;
}
.graph {
	width: 100%;
	height: 100%;
}
.graphAuto {
	width: 100%;
	height: 100%;
}


Quelqu'un a une solution ?

Merci

@+
Je crois que IE n'interprete tout simplement pas cette propriété.
Je me demande si ça ne sera pas abandonné pour CSS2.1 d'ailleurs, mais je ne l'affirme pas Smiley cligne
c'est effectivement abandonné ds le css 2.1

Il n'existe donc pas de moyen pour imprimer en paysage ?
Sinon, est-il possible de faire une rotation de 90° en CSS ?

Smiley bawling
Rotation via CSS impossible.

Impression en paysage, bah le navigateur le permet dans les propriétés d'impression, c'est à l'utilisateur de le décider, tout simplement.
D'après Laurent dans son billet:
Laurent Denis sur Blog and Blue a écrit :
Suppression de la propriété size qui spécifiait la taille et l'orientation d'une boîte de page. Il ne serait donc plus possible de tenter de forcer l'orientation portait ou paysage, ou des dimensions absolues spécifiques (Apparemment, seul Opera implémente cette propriété) ;


Et puis que les clients tiquent c'est normal, ce sont des clients Smiley biggrin
Pas de solution pour ma part, mais comme les possibilités d'impressions sont au libre arbitre de l'utilisateur et de son agent utilisateur...
Modifié le 30 Nov 2004 - 20:11
T'as pas à chercher plus loin, tu ne pourras par obliger l'impression dans telle disposition ou telle autre, sur ce plan, l'utilisateur final aura toujours le choix.
pas que Opéra, je n'ai pas eu de pb avec FireFox
Enfin je trouve ça un peut idiot d'enlever ça, ça sert pour la bonne présentation des données, plus que les marges, qui elles restent...
A quoi ça sert de faire un CSS pour l'impression si on peut rien mettre dedans...
En fait, Laurent avait l'air de dire que telles ou telles propriétés étaient retirées car très peu prise en compte par les différents navigateurs, aparement celle ci pourrait en faire partie, la preuve elle ne fonctionne pas sous IE.

Par contre, tu peux toujours la laisser puisque ça semble fonctionner sous firefox.
Modifié le 30 Nov 2004 - 20:19
c'est pour un site en intranet... je dirais 99% des utilisateurs avec IE donc il me faudrait une ptite soluce pour IE Smiley cligne

Je peux à la limite leur faire patcher leur IE, mais les faire changer de navigateur... Smiley ohwell
au pire je regarderais demain si je ne peux pas générer le graphique dans l'autre sens pour pouvoir l'imprimer...
j'allais proposer la même chose, le même graphique dans la bonne position avec une classe qui ne l'affiche qu'au media print et inversément. Vu qu'il s'agit d'un intranet la bande passante est pas capitale, j'avais fait le test et les éléments en display:none sont quand même chargé en fond.