如何制定只影响文本而不影响图像的 CSS 规则？

Question

I am using a php script that outputs the post like this:

<div class="postoutput">
  <p>
    <img src="content/xeon.png" alt="xeon.png">
    This is text, Xeon is great.```
  </p>
</div>

I can't touch the output but I can modify the CSS, is there way to add a margin that ONLY applies to the text using only CSS

The image is 100% wide and this is okay.

The desired goal is to keep the image as it is but make the text ONLY have a 10px margin on each side. Remember, I only have access to the CSS file.

Answer 1

Long story short... no you cannot apply css directly to the text in your case.

You could probably emulate something close though.

Assuming your image is fullwidth you could probably use something like:

p {
   padding:10px;
}

p > img {
   margin:-10px -10px 10px;
}