Support » Theme: Capri Lite » Header not displaying correctly

  • Resolved paulamagaz

    (@paulamagaz)


    Hey there!

    I’ve been struggling with the header on my site (paulamagazine.fi) for a while now. The logo header (“paula”) doesn’t display in its full size on other devices, e.g. mobile. Right now it cuts the header, and only looks fine on desktop.

    I’ve tried googling a bunch of CSS but none have proven to work. Any idea what I should do? The deadline is tomorrow night so I’m kind of running out of time.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hey there,

    The Big Title section is designed to be a full-width section and as a result, the background image is designed to cover the entire section, from top to bottom. This is the reason why the same big image can’t look exactly the same on every device. A small mobile device will not have the physical possibilities to display the entire picture, at the same time keeping the image ratio and all its properties. This is why, with some images, on mobile devices, some portions of the image may not be visible.

    The only solution, if you want to make sure the entire picture is visible on mobile devices would be to add the following code in Appearance > Customize > Additional CSS:

    @media (max-width: 480px) {
    .blog-entry-header{
    background-size: contain !important;
    background-repeat: no-repeat;
    }
    }

    This might create a grey bar on top/bottom of the image. But this is the only solution available.

    This way, each part of the image will be visible, but the dimensions will be different, depending on the image you are using and the device you are testing on.

    I hope you understand. Let us know if you have other questions about the theme.

    I am having an issue with my current WP site: Technifab.com

    Currently, the header and footer are not appearing to render with CSS applied. Also the theme options button within WP is not working correctly. The content loads but looks broken.

    Can someone take a look at my site and let me know if they have any suggestions. I have put 2 days into this issue and cannot find what is wrong.

    Thanks so much in advance.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Header not displaying correctly’ is closed to new replies.