Wordpress Inline Images - Ignore-t-il les valeurs de marge de droite?

Question

J'utilise le thème des nouvelles originales de WooThemes (c'était gratuit!) Et je fais quelques modifications. J'ai quelques images en ligne dans mes entrées et ce qui se passe est que le texte et les images sont à peu près les uns contre les autres. J'ai réussi à le faire réparer (un peu) lorsque les images sont sur le côté droit de l'entrée en ajoutant une bordure 5px autour de l'image en utilisant ce code dans le CSS:

.entry img { 
    padding: 2px 2px 2px 2px; 
    background:#FFF; 
    border: solid 5px #FFF; 
    } 

Il fonctionne sur la gauche, mais la le droit semble être poussé sous le texte.

Mais je viens de réaliser que mes images ont une légende autour d'eux en utilisant la classe "wp-caption", est-ce que cela pourrait être une source possible de mes problèmes?

Appréciez l'aide!

Answer 1

margin: 10px !important; 

peut faire l'affaire.

Vous pouvez également rendre le CSS plus précise en utilisant ce genre de chose

body #foo .entry img { 
    padding: 2px 2px 2px 2px; 
    background:#FFF; 
    border: solid 5px #FFF; 
    } 

choisir un ID approprié au lieu de #foo bien sûr.

Answer 2

Comme mentionné précédemment, définissez un margin sur l'image. Vous souhaiterez peut-être ajouter des règles CSS pour les classes alignleft et alignright; ceux-ci sont ajoutés par le sélecteur d'image WordPress lorsque vous cliquez sur les boutons "Aligner à gauche" ou "Aligner à droite". Ajouter une règle spécifiant une marge sur le côté opposé de l'alignement:

.entry img.alignleft { 
    margin-right: 1em; 
} 
.entry img.alignright { 
    margin-left: 1em; 
} 

Par ailleurs, vous devez PAS utiliser la propriétéborder pour rendre l'image s'écarter du texte. La propriété border est utilisée pour dessiner une bordure; Si vous changez la couleur d'arrière-plan, vous trouverez une bordure blanche autour de votre image, et le texte touchera cette bordure. Pour que les éléments se démarquent les uns des autres, utilisez la propriété margin.