Bonjour,
Je rencontre deux problèmes concernant des images avec ma CSS destinée à l'impression.
1. Sur cette page de mon blog se trouve un carousel (nommé "roundabout-jeunesse" dans le code ci-dessous) de 7 images. Lorsque je fais un "Aperçu avant impression" (testé sous Firefox et Internet Explorer), mes images (positionnées en float: left) apparaissent bien les unes à côté des autres, mais elles sont toutes carrées ! Les dimensions des images sont pourtant bien spécifiées explicitement dans le code HTML, et aucune hauteur ou largeur n'est spécifiée dans la CSS (étant donnée que je ne peux connaître d'avance la taille de mon image, dans la mesure où elle varie).
Voici le code CSS utilisé pour les images dans ma feuille de style dédiée à l'impression :
Quelqu'un comprend-il pourquoi mes images apparaissent en carré plutôt que dans leur taille d'origine ?
2. Sur la page d'accueil du blog figure un autre carousel, contenant des billets (un seul pour l'instant) avec une image. Or, lors de l'aperçu avant impression, cette image (la première tout en haut de la page) s'étire sur toute la largeur de la page ! Et je ne comprends absolument pas pourquoi... Les autres images de la page sont, elles, correctement affichées. L'ennui c'est que, là encore, je ne peux connaître d'avance la taille de l'image (qui varie d'un billet à l'autre), ce qui aurait permis de la spécifier dans la CSS. Dans la mesure néanmoins où cette taille est précisée dans le code HTML, je pensais pouvoir ajouter un "img { height: 100%; width: 100%; }" mais cela ne change absolument rien !
Merci beaucoup pour votre aide !
Modifié par Fix (22 Apr 2011 - 15:25)
Je rencontre deux problèmes concernant des images avec ma CSS destinée à l'impression.
1. Sur cette page de mon blog se trouve un carousel (nommé "roundabout-jeunesse" dans le code ci-dessous) de 7 images. Lorsque je fais un "Aperçu avant impression" (testé sous Firefox et Internet Explorer), mes images (positionnées en float: left) apparaissent bien les unes à côté des autres, mais elles sont toutes carrées ! Les dimensions des images sont pourtant bien spécifiées explicitement dans le code HTML, et aucune hauteur ou largeur n'est spécifiée dans la CSS (étant donnée que je ne peux connaître d'avance la taille de mon image, dans la mesure où elle varie).
Voici le code CSS utilisé pour les images dans ma feuille de style dédiée à l'impression :
#content img { padding: 5px; margin: 0 20px 10px 0; border: 1px solid #000; }
#content img.icone { padding: 0; margin: 0; border: 0; }
#content img.left { float: left; }
#content img.right { float: right; margin: 0 0 10px 20px; }
#roundabout-jeunesse li { list-style: none; float: left; }
#roundabout-jeunesse li img { border: 0; }Quelqu'un comprend-il pourquoi mes images apparaissent en carré plutôt que dans leur taille d'origine ?
2. Sur la page d'accueil du blog figure un autre carousel, contenant des billets (un seul pour l'instant) avec une image. Or, lors de l'aperçu avant impression, cette image (la première tout en haut de la page) s'étire sur toute la largeur de la page ! Et je ne comprends absolument pas pourquoi... Les autres images de la page sont, elles, correctement affichées. L'ennui c'est que, là encore, je ne peux connaître d'avance la taille de l'image (qui varie d'un billet à l'autre), ce qui aurait permis de la spécifier dans la CSS. Dans la mesure néanmoins où cette taille est précisée dans le code HTML, je pensais pouvoir ajouter un "img { height: 100%; width: 100%; }" mais cela ne change absolument rien !
Merci beaucoup pour votre aide !
Modifié par Fix (22 Apr 2011 - 15:25)