Text wrapping and images in ordered lists

I’ve got a couple of ideas, though without testing them, I can’t guarantee they’ll work.

If you’ve got a fixed-width theme, you could try making the images the same width as the content area you’re putting them in, or even put them on a background if you have to in order to make them occupy the entire space.

Or, you could put the entire post in a “div” element with a class like “bullets_and_images” and then add something like this to your CSS to try to prevent the text from wrapping:

.bullets_and_images img {
  clear: both;
}

I wish I had a better solution, but part of my motivation for posting is so I’ll be notified if there are answers with better solutions. : )

Thanks for the input. Not having any familiarity with CSS, and the fact that there are dozens of CSS/PHP files in the blog directories, I have no idea what to modify, or where.

I’m sure the theme is fixed-width, since it is one of the pre-constructed, multi-column themes available in the WordPress store (free area, not paid). As far as placing them in the background, I need to be able to show screen captures at each step at times, so showing them in the background isn’t really going to solve the issue.

Fortunately I don’t have any readers yet… ??

Would you mind sharing a link to the page that you are referencing?

Okay, I didn’t realize what level you were at in terms of developer skills. Let me take a step back.

With the cursor at the end of the line of your bulleted text (list item), when you click Add Media to add the screenshots, what happens if you select “None” as the alignment for the image? Doesn’t that accomplish what you’re asking for without any text wrapping?

It almost did what I needed it to do. I did figure it out though. Here’s what I used:

1. Try to hatch the entire thing (ignoring islands) by selecting the entire object.
2. If that works, select the hatch and zoom in to an area where you want to add an island.
3. Under the ‘Hatch Editor’ tab, in the ‘Boundaries’ group, click the ‘Select’ button.

<img class=”alignnone size-full wp-image-196″ src=”https://www.govihines.info/wp-content/uploads/2014/07/image1.png&#8221; alt=”HatchError1″ width=”145″ height=”97″ />
<ol start=”4″>

• Then, select a boundary that is not being used for an island and hit return. My screen looks like this:

<img class=”alignnone size-full wp-image-197″ src=”https://www.govihines.info/wp-content/uploads/2014/07/image2.png&#8221; alt=”HatchError2″ width=”633″ height=”429″ />
<ol start=”5″>

• I selected the yellow polyline in the middle since it doesn’t seem to be working when I created the hatch. After hitting return, the result looks like this: />

<img class=”alignnone size-full wp-image-198″ src=”https://www.govihines.info/wp-content/uploads/2014/07/image3.png&#8221; alt=”HatchError3″ width=”610″ height=”387″ />

You can see the final post here:

Thanks for your help!

Awesome!!!

Looks good to me. I’m glad you got it figured out.

Thanks. I unintentionally made it sound like I figured it out on my own, when in fact, your tip RE the “none” alignment was the nudge I needed to figure the rest out. I had a feeling it would be something simple, but am not familiar enough with the language to know what would work or not.

Thanks again!