• I have an image at the top of the Home page (not the header) that is supposed to be centered with the caption centered under it. I’ve tried targeting it several times in the child theme style sheet but it isn’t behaving like the other image below it or on the rest of the images on the site. I have tried setting both the image and the option aligncenter but what I am getting is an image that gets resized to a smaller width, shifted to the right, and offset from the caption which is flush left. I’ve tried using a larger image, setting the image and caption flush left so they are together and it still ends up as the offset smaller image.

    I just looked at the source page in the browser and now I see why but I don’t know why it is happening or how to stop it from happening.

    This first image starts after a `<div class=”pf-content”>. I searched the theme’s style sheet for pf-content but there is no style for it. I searched all of the WordPress installation and found it in a pf.php function that is part of WooComerce, which I am not using. The code in the source page is extremely lengthy with lots of empty quotations, and several possible resizes.

    
    		<div class="entry-content">
    				<div class="pf-content"><figure id="attachment_1168" style="width: 900px" class="wp-caption aligncenter"><a href="https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png"><img data-attachment-id="1168" data-permalink="https://dev.baeecorp.org/home/reception_panorama-900x219/" data-orig-file="https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?fit=900%2C219" data-orig-size="900,219" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="USBG Exhibition Reception Panorama" data-image-description="" data-medium-file="https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?fit=300%2C73" data-large-file="https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?fit=525%2C128" src="https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?resize=525%2C128" alt="Photo of the opening exhibition at the U.S. Botanic Garden" class="size-full wp-image-1168" style="border:5px double #ccc; text-align:center;" srcset="https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?resize=900%2C219 900w, https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?resize=300%2C73 300w, https://i0.wp.com/dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png?resize=768%2C187 768w" sizes="(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px" data-recalc-dims="1" /></a><figcaption class="wp-caption-text">Panorama of the opening reception, February 2014, at the U.S. Botanic Garden for the BAEE Exhibition.<br />Photo credit: Dennis Chesters.</figcaption></figure>

    How can I target this image in the child theme’s CSS so it doesn’t get given the WooCommerce treatment??

    The following is how I have it coded in the Home page. It keeps getting reduced from 900 px to 500 px wide. I’ve tried using a 1000px image, even a 2000px image and they all get shrunken and offset.
    [caption id="attachment_1168" align="aligncenter" width="900"]<a href="https://dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png"><img src="https://dev.baeecorp.org/wp-content/uploads/reception_panorama-900x219.png" alt="Photo of the opening exhibition at the U.S. Botanic Garden" width="900" height="219" class="size-full wp-image-1168" style="border:5px double #ccc; text-align:center;" /></a> Panorama of the opening reception, February 2014, at the U.S. Botanic Garden for the BAEE Exhibition.<br />Photo credit: Dennis Chesters.[/caption]

    Why is WooCommerce taking over my image? How do I stop it from happening?

    Thanks for your help.

Viewing 1 replies (of 1 total)
  • I have the same trouble: block of text after first image rolled into “pf-content” div… But I think that “pf” is pop-up of PrintFriendly plugin. Do you have it too?

Viewing 1 replies (of 1 total)
  • The topic ‘Why is div.pf-content being used for the first image at the top of my page?’ is closed to new replies.