Testing image offset for 2023 theme.

Looks like this area is 650px wide by default. Note this for the attempt at hacking this below…

Lorem ipsum dolor sit amet consectetur adipiscing elit, urna consequat felis vehicula class ultricies mollis dictumst, aenean non a in donec nulla. Phasellus ante pellentesque erat cum risus consequat imperdiet aliquam, integer placerat et turpis mi eros nec lobortis taciti, vehicula nisl litora tellus ligula porttitor metus.

Vivamus integer non suscipit taciti mus etiam at primis tempor sagittis sit, euismod libero facilisi aptent elementum felis blandit cursus gravida sociis erat ante, eleifend lectus nullam dapibus netus feugiat curae curabitur est ad. Massa curae fringilla porttitor quam sollicitudin iaculis aptent leo ligula euismod dictumst, orci penatibus mauris eros etiam praesent erat volutpat posuere hac. Metus fringilla nec ullamcorper odio aliquam lacinia conubia mauris tempor,

Here the kitten is offset on front end…

way far to the right even though it’s a small image. But other images on this site not offset. Even when not embedded in a column or whatnot. Still, I want to test that… see below.

etiam ultricies proin quisque lectus sociis id tristique, integer phasellus taciti pretium adipiscing tortor sagittis ligula.

Mollis pretium lorem primis senectus habitasse lectus scelerisque donec, ultricies tortor suspendisse adipiscing fusce morbi volutpat pellentesque, consectetur mi risus molestie curae malesuada cum. Dignissim lacus convallis massa mauris enim ad mattis magnis senectus montes, mollis taciti phasellus accumsan bibendum semper blandit suspendisse faucibus nibh est, metus lobortis morbi cras magna vivamus per risus fermentum. Dapibus imperdiet praesent magnis ridiculus congue gravida curabitur dictum sagittis, enim et magna sit inceptos sodales parturient pharetra mollis, aenean vel nostra tellus commodo pretium sapien sociosqu.

I’m coloring the groups for clarity on front end.

Even in preview, putting it into a group gets rid of the offset.

By setting the content width lower than 100%, the image still pops to the side. But this requires text to be narrower than the main content area.

Keeping this “pure” to demo the failure without the fix.

blah blah blah

words here. blah blah Group set to proper pixel width, 650px.

Now I’ve attempted to set the group’s width to 650px/800px.

This makes the block the correct width but doesn’t fix the image pop.

Which makes sense because the image isn’t “wide” but align-left or right.

But it is fixed now since I added the full-width image below (so adding the image affects both images placed after AND before)

So, since I was able to “fix” the image pop below by adding a cover block and settings its custom width, what happens if I do add a “wide” image to this group? Does it also fix it? Let’s see…

quam sollicitudin iaculis aptent leo ligula euismod dictumst, orci penatibus mauris eros etiam praesent erat volutpat posuere hac. Metus fringilla nec

Does the presence of the wide image above affect how kitteh below displays?

BINGO! YES IT DOES!

Note that I didn’t even do anything to the image other than set it to be “wide.”

Note also that it fixes the entire block to have the color fill the whole area, creating padding by filling the space up to the wide image. I’ve not added padding or margins to this. Just the wide image.

May be impossible to set a wide width to anything wider than the “width” established with first box. Next I’ll try it with other than px.

Also kills the effect on this image. …or did until I added the wide width image.

Full width goes only to the edge of the content area. (which has been reduced to 50% with “inner blocks use content width” setting). This image is set to “Full”) and doesn’t have the custom width settigns internal to the Cover Block that also fixed this.

If I do the opposite (800/650), it makes the whole column 800px (of course) but does not make the images pop out.

Because aligned images are not “wide width,” natch. This is functioning “as expected” so probably the solution (if there is one) is in the above Group.

quam sollicitudin iaculis aptent leo ligula euismod dictumst, orci penatibus mauris eros etiam praesent erat volutpat posuere hac. Metus fringilla nec ullamcorper odio aliquam lacinia conubia mauris tempor, etiam ultricies proin quisque lectus sociis id tristique, integer phasellus taciti pretium adipiscing tortor sagittis ligula.

content/wide = 650/1200

got it to work herein by adding a cover image with vw internal settings.

Also kills the effect on this image…until I selected wv content width setting on Cover block!

Full width goes only to the edge of the content area (which has been reduced to 80%/100% with “inner blocks use content width” setting) until I made this change.

Also kills the effect on this image…until I selected content width setting on Cover block!

Full width goes only to the edge of the content area. (which has been reduced to 80%/100% with “inner blocks use content width” setting).

What’s interesting here is that it reset the column width entirely, not to what it was originally.

Why does changing the “inner blocks use…” setting work for the cover block, but not for the Group block?
I think it might be because I used VW rather than percent. Percent likely is 100% of the established area, whereas VW goes beyond it. Let’s see!

Here it is in a single column, no group, no offset.

By setting the content width to 50% on column as well, the image pops to the side. Or rather, the image fills 50% and the text is forced to be less.

Also kils the effect on this image.

Here it is in a single column, no group, no offset.

Set to wide width

Content/wide = 60/40wv

Also kills the effect on this image…until I selected content width setting on Cover block!

Full width goes only to the edge of the content area (which has been reduced to 80%/100% with “inner blocks use content width” setting) until I made this change.