How to make the header image look right on any size screen

  • godfrey.lc

    (@godfreylc)


    9 years ago

    Hi there,
    I’m building a website using the Academica theme, and I can’t figure out how to make the header image that I upload look right/be cropped properly. The problem seems to be that the header image size is responsive depending on the size of the computer screen being used — so on my laptop it looks fine and the full image is visible, but on a larger screen the image is very badly cropped and cut off. On a larger screen (bigger than my 13″ laptop), the navigation bar also gets pushed down so it’s actually cutting off part of the website. How can I fix this so the full header image is visible on any size screen?

    I’m not that experienced with CSS/coding, so please explain step-by-step.

    The website: https://dev.bookclubinabox.com

    Thanks!

Viewing 1 replies (of 1 total)
  • Tahoerock

    (@tahoerock)

    Hi godfrey.lc
    I took a look on your site on my MacBook Pro, used resizer in chrome to demonstrate all kind of screen resolutions.
    I installed fresh theme Academica on my server.
    I took a look on your website on the MacBook, iPad and 24″ desktop
    I took a look on my site, new theme Academica website on MacBook, iPad and 24″ desktop
    I took a look on your site on iPhone 6+

    Result is always same.
    Theme Academica is not doing responsive work, it hides part of the header image on smaller screens. It shrinks sidebar and block content very strangely
    It behaves not like right responsive theme.

    My advice: before you do any further work,
    1) contact theme author – if they do not help!!!! then
    2) think on some other theme.

    I can be helpful if you want, but not with this theme.
    Sorry to say.
    Cheers
    TR

Viewing 1 replies (of 1 total)
  • The topic ‘How to make the header image look right on any size screen’ is closed to new replies.

Tags