Stylised skewed cover photo padding on left from original theme

  • Hi,

    I like the skewed effect from the original theme demo where there’s padding on the left of the image covers at the top and bottom of the homepage, but it seems to have disappeared/stopped working on my site. The padding of the cover block only affects the positioning of the overlayed title and link and the margins can only be adjusted top/bottom.

    (I have a separate issue where I’ve been adding external CSS to adjust the fixed background image responsiveness for mobile and tablet viewing, playing around with background size and image repeat settings so it’s not overly zoomed in, cropped or with space showing around the edges. I’ve got a combination of settings that’s seems to do the trick but it would be better if there was a way to adjust the space between from the background-repeat: space setting, or the minimum height of the block itself when switching between views [450px looks great on desktop but shows edge space on tablet]. On a non-premium plan so can’t do plug ins or html, and bit of a novice with css. Anyway to adjust these?)

    Any help appreciated, cheers!

    The blog I need help with is: (visible only to logged in users)

  • The theme is Outland btw. Sorry thought the forum link would take me to a theme specific thread.

  • Hi there,

    I like the skewed effect from the original theme demo where there’s padding on the left of the image covers at the top and bottom of the homepage, but it seems to have disappeared/stopped working on my site. The padding of the cover block only affects the positioning of the overlayed title and link and the margins can only be adjusted top/bottom.

    Thank you for letting us know about this.
    I was able to reproduce this issue on my test sites and have reported it to our developers.

    I have a separate issue where I’ve been adding external CSS to adjust the fixed background image responsiveness for mobile and tablet viewing, playing around with background size and image repeat settings so it’s not overly zoomed in, cropped or with space showing around the edges. I’ve got a combination of settings that’s seems to do the trick but it would be better if there was a way to adjust the space between from the background-repeat: space setting, or the minimum height of the block itself when switching between views [450px looks great on desktop but shows edge space on tablet]. On a non-premium plan so can’t do plug ins or html, and bit of a novice with css. Anyway to adjust these?

    At the moment, I’m afraid there is no built-in way to adjust block settings according to device size.

    At the moment, the solution is to either use CSS or set up the site in a way that works across multiple screen sizes by taking advantage of the layout blocks, such as the Grid block:

    WP
    Blocks (The Full List) » Grid Block
    4 min read
    The Grid block is a container for other blocks. Use it to organize multiple blocks and adjust the color, text style, height, width, and position of all blocks inside the container. This block is a variation of the Group block. Add the Grid Block You can start with a new, empty Grid block or group existing blocks into a grid. Add a New Grid Block To add a new Grid block, click the + b
Reply to Stylised skewed cover photo padding on left from original theme