Hello à tous !
Je me permets de venir solliciter votre aide car je bloque sur un problème depuis plusieurs heures et mes différentes recherches sur le web ont été infructueuses.
Je souhaite tout simplement réaliser un style pour l'impression. Jusque là, tout va bien, la mise en page est correcte et le contenu à imprimer est bien le bon. Pourtant, chose que je ne parviens pas à comprendre, lorsque je désire imprimer, la première page est blanche (quoique Opera y place un rectangle gris).
J'ai d'abord pensé que j'avais oublié de masquer un de mes calques, mais rien y fait ! Je n'arrive pas à me débarrasser de cette page vide.
J'ai également consulté les articles http://www.alsacreations.com/astuce/lire/1160-une-feuille-de-styles-de-base-pour-le-media-print.html et http://www.alsacreations.com/tuto/lire/586-feuille-style-css-print-impression.html et m'en suis inspiré mais cela n'a pas résolu mon problème.
Si je choisis d'afficher le logo placé dans mon header, celui-ci vient bien se positionner tout en haut de la première page, mais pas la suite du contenu qui saute à la deuxième. J'ai tenté d'utiliser les commandes page-break-before, page-break-after et page-break-inside en les plaçant toutes sur none, mais sans succès.
La question a sûrement déjà été posée bien des fois, mais je n'y ai malheureusement pas trouvé de réponse.
Merci d'avance à ceux qui prendront le temps de lire et d'éventuellement de répondre à ce message !
Voici mon code :
Je me permets de venir solliciter votre aide car je bloque sur un problème depuis plusieurs heures et mes différentes recherches sur le web ont été infructueuses.
Je souhaite tout simplement réaliser un style pour l'impression. Jusque là, tout va bien, la mise en page est correcte et le contenu à imprimer est bien le bon. Pourtant, chose que je ne parviens pas à comprendre, lorsque je désire imprimer, la première page est blanche (quoique Opera y place un rectangle gris).
J'ai d'abord pensé que j'avais oublié de masquer un de mes calques, mais rien y fait ! Je n'arrive pas à me débarrasser de cette page vide.
J'ai également consulté les articles http://www.alsacreations.com/astuce/lire/1160-une-feuille-de-styles-de-base-pour-le-media-print.html et http://www.alsacreations.com/tuto/lire/586-feuille-style-css-print-impression.html et m'en suis inspiré mais cela n'a pas résolu mon problème.
Si je choisis d'afficher le logo placé dans mon header, celui-ci vient bien se positionner tout en haut de la première page, mais pas la suite du contenu qui saute à la deuxième. J'ai tenté d'utiliser les commandes page-break-before, page-break-after et page-break-inside en les plaçant toutes sur none, mais sans succès.
La question a sûrement déjà été posée bien des fois, mais je n'y ai malheureusement pas trouvé de réponse.
Merci d'avance à ceux qui prendront le temps de lire et d'éventuellement de répondre à ce message !
Voici mon code :
/*** RESET ***/
* {
margin : 0;
padding : 0;
border : 0;
}
/*** HTML ***/
html {
margin: 0;
padding: 0;
border: 0;
}
/*** BODY ***/
body {
width: auto!important;
margin: auto!important;
padding: 0;
border: 0;
font-family: Helvetica, "Lucida Sans", Verdana, Arial, "Lucida Grande", Sans-Serif;
font-size: 11pt;
text-align: left;
color: #000!important;
background-color: #fff!important;
}
/*** LES ELEMENTS A NE PAS AFFICHER ***/
.no_print {
display: none;
}
/*** LES ELEMENTS A AFFICHER ***/
/* Le logo */
#logo {
float: none;
display: block;
}
/* L'élément sélectionné */
.current_print_item {
float: none;
display: block;
}
/* Le titre h2 */
h2 {
font-family: Helvetica, Verdana, Arial, "Lucida Grande", Sans-Serif;
font-size: 13pt;
text-align: left;
color: #000!important;
margin: auto!important;
line-height: 1.5;
}
/* Les paragraphes */
p {
font-family: Helvetica, Verdana, Arial, "Lucida Grande", Sans-Serif;
font-size: 11pt;
text-align: left;
line-height: 1.5;
color: #000!important;
margin: auto!important;
/* pas de ligne seule en bas */
orphans: 3;
/* pas de ligne seule en haut */
widows: 3;
}
/* Les images */
img {
text-align: left;
vertical-align: middle;
padding: 0;
margin-top: 5mm;
margin-bottom: 5mm;
margin-left: 0;
margin-right: 0;
border: 0;
display: block;
}
/* Les liens */
a:link, a:visited {
color: #781351;
}