There are some tweaks you can make after you have placed an inline image in your Body copy. For example, you can eliminate "orphan" lines of text up all by themselves next to the image, and you can add some padding on one or more sides to give the image a little breathing room.
Select any page where you want to put an in-line image and click the edit button.
- Preparing to format. Select the image, being careful not to select any surrounding text. Just clicking on it once should do the trick. Now, click the Image icon, which is the one just to the left of the Media icon in the editor ribbon bar. (ADA compliance: In the dialog box that comes up, be sure that some descriptive text is entered into the "alternative text" box.)
- Image alignment. For a full-width image, if you have an orphan word or two, then from the alignment value choose either left or right, depending where on the page you want the image to appear. This mostly matters for thumbnails, and for now, I recommend against using thumbnails, as they do not resize responsively for different devices. Do not leave this drop-down as "not set"; the image will not behave correctly if you do. For full-width images, the best thing to do is, in the text (not in any of the image editing boxes), to put a return right after the image, and skip the alignment value.
- Image padding. Now we're going to create a little room around the image. At the top of the Image Properties box, click on the "Advanced" tab. In the "Style" box you will see the values you have already entered. Enter an additional style parameter like this: "padding-right: 10px;" for a picture on the left side, and "padding-left: 10px;" for a picture on the right. (Don't type the quotation marks, but be sure not to miss the semicolon.)
- Done. Click the OK button, and your image will be inserted and formatted nicely.