Title: Image and Content Offset
Last modified: April 4, 2023

---

# Image and Content Offset

 *  Resolved [lisia](https://wordpress.org/support/users/lisia/)
 * (@lisia)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/)
 * Hello! In the block pattern “Image and Content Offset” the image and the text
   should appear one below the other in the mobile view. This would be great. Best
   regards, lisia
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fimage-and-content-offset%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 5 replies - 1 through 5 (of 5 total)

 *  Theme Author [UXL Themes](https://wordpress.org/support/users/uxl/)
 * (@uxl)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/#post-16635645)
 * Hi [@lisia](https://wordpress.org/support/users/lisia/)
 * The image and the text do already appear one below the other in mobile view.
 * If it is not displaying properly on your website, could you please let me know
   your site URL and I’ll be happy to take a look. Thanks.
 *  Thread Starter [lisia](https://wordpress.org/support/users/lisia/)
 * (@lisia)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/#post-16641019)
 * Thank you for your response. Unfortunately it doesn’t work well on my site in
   mobile view, which is just at beginning.
 * [https://hello.co.at/moderation/](https://hello.co.at/moderation/)
 * Best regards, lisia
 *  Theme Author [UXL Themes](https://wordpress.org/support/users/uxl/)
 * (@uxl)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/#post-16645007)
 * Thanks for providing the link.
 * I can see what you mean on mobile. The face in the image is covered on mobile.
 * The pattern is designed so that the text box overlaps the image on the left and
   then on mobile the overlap moves to be lower and not cover as much of the left
   side of the image, but a bit more of the lower half of the image.
 * It’s difficult to get it exactly right for all situations as we don’t know beforehand
   what content & images will be used on someone’s website.
 * If I have understood correctly, you would like to have no overlap whatsoever 
   on mobile?
 * If so, please copy & paste this custom CSS at Appearance > Editor > Styles > 
   Additional CSS:
 *     ```wp-block-code
       @media (max-width: 599px) {
         .wp-block-query.is-style-offset .is-style-offset-wrap {
           display: block;
         }
       }
       ```
   
 * The CSS code above will change the block style from `grid` to `block` and remove
   the overlap/offset on mobile only.
 *  Thread Starter [lisia](https://wordpress.org/support/users/lisia/)
 * (@lisia)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/#post-16645889)
 * Thank you.
 * First I could not see the field “additional css”. But then I found it with the
   url …/wp-admin/customize.php.
 * Then I added the code and even added !important.:
 *     ```wp-block-code
       @media (max-width: 599px) {
         .wp-block-query.is-style-offset .is-style-offset-wrap {
           display: block !important;
         }
       }
       ```
   
 * Now it works in the mobile view.
 * Thank you, best regards, lisia
    -  This reply was modified 3 years, 2 months ago by [lisia](https://wordpress.org/support/users/lisia/).
 *  Theme Author [UXL Themes](https://wordpress.org/support/users/uxl/)
 * (@uxl)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/#post-16648327)
 * In WP 6.2 the Additional CSS can be found by clicking the three vertical dots
   to the right of the Styles heading.
 * See image below from the [site editor documentation](https://wordpress.org/documentation/article/styles-overview/#site-wide-custom-css).
 * ![](https://i0.wp.com/wordpress.org/documentation/files/2023/03/Screen-Shot-2023-
   03-27-at-4.15.11-PM.png?ssl=1)
 * The `!important` declaration shouldn’t be needed, but leaving it there should
   do no harm either.
 * Thank you for letting us know the custom CSS worked.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Image and Content Offset’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/pria/1.1.1/screenshot.png)
 * Pria
 * [Support Threads](https://wordpress.org/support/theme/pria/)
 * [Active Topics](https://wordpress.org/support/theme/pria/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/pria/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/pria/reviews/)

 * 5 replies
 * 2 participants
 * Last reply from: [UXL Themes](https://wordpress.org/support/users/uxl/)
 * Last activity: [3 years, 2 months ago](https://wordpress.org/support/topic/image-and-content-offset/#post-16648327)
 * Status: resolved