For CSS experts: image alignment and list

[Sonya*]

Hi,

can someone help me to correct the issue below?

I have added an image in post and aligned it to the left. The list beside the image has now wrong padding. The list item markers are not in one line with the paragraphs above and below, but have an negative indent. How do I correct it via CSS?

Thank you,
Sonya

[Joy Rex]

The easiest way to find out how to fix this is to use your browser's Developer Tools and inspect that element to see what classes are controlling the indent/outdent.

[Sonya*]

12 hours ago, Joy Rex said:

The easiest way to find out how to fix this is to use your browser's Developer Tools and inspect that element to see what classes are controlling the indent/outdent.

Unfortunately I do not understand how to indent generally beside the all aligned images. The padding should be as wide as image, but I cannot know the width of the image in advance. The images can have different width. I can fix it for one image (e. g. for the example above) but it does not work for other images that have another width 😒

This does work for the example above:

ul {    
  margin-left: 400px;
}

But only for the images with width of 400px. Padding does not work. What I need is a general fix for all lists and all images.

[opentype]

Personally, I would just right-align the image. 

[Sonya*]

After hours of trying and error:

.ipsType_richText ul {
    list-style-position: inside;
}

This seems to do the job correctly.