Version complète: sur le forum Webmaster Hub : alignement bizarre
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
willy
bonjour,

Je voudrais faire une mise en page adaptée à l'impression: pas de menu, pas de pub.
J'ai une image et le texte en justifié autour de celle-ci, exemple:
http://www.mer-littoral.org/02/hemimycale-columella.php
en mode media="screen, projection" pas de problème, mais quand je fais ma feuille de style pour l'impression si le texte est justifié, il se met sous la photo, alors que si je mets: text-align: left; il se met bien autour de la photo. (voir lien ci dessus avec apercu avant impression)

voici le style de ma balise p

p{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
text-justify: auto;
}

ma question, connaitriez-vous la solution pour obtenir le texte justifié autour de l'image à l'impression.
Merci pour toutes vos réponses smile.gif

willy
LaurentDenis
CITATION(willy @ 20 Oct 2004, 18:33)
voici le style de ma balise p

p{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
text-justify: auto;
}


Utilise text-align: justify qui est conforme à CSS2, alors que text-justify est actuellement une propriété CSS purement microsoft wink.gif

(A ne pas confondre avec la propriété homonyme de la future CSS3, qui ne sert pas du tout au même usage, mais spécifie après un text-align:justify l'algorithme précis de justification du texte selon la langue).
willy
corrigé, merci, je ne sais pas où je suis allé chercher celle-là blink.gif

toutefois ça ne résout pas le problème.

Auriez-vous une idée ?
LaurentDenis
Cela ne se produit que dans IE, qui a souvent des difficultés avec le texte justifié.

En fait, ta css print est inutilement complexe:
- supprime toute mention de largeur saf pour rétablir des width 100%
- ramène les paddings et margin à zéro
- ramène les flottants en static (float:none) sauf ton image bien-sûr
- etc.

Par exemple:

CODE
.volume5 {
float: none;
width: 100%;
text-align: justify;
margin: 0;
padding: 0;
}


Et IE arrivera à justifier le texte wink.gif
willy
Et ça marche biggrin.gif

Merci de m'avoir aidé LaurentDenis, j'ai supprimé toutes les infos inutiles, pour ne laisser que le body sans taille fixe et margin padding à 0 comme tu m'as dit, caché les div que je ne voulais pas voir, image en float, et ça marche.

encore merci.
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.