Home / Forums / ePix Support / Menu image too big on tablet

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • Marinske
    Marinske
    Participant

    On tablet the menu squirrel image is too big and not sharp.
    Is it possible to keep it the same size on every device?

    Screenshot is here: http://www.marinske.com/screenshot

    (It shows the menu items twice, this problem only occurs in my browser, not on a tablet)

    Hi @jezus

    To fix this, copy and paste this CSS into Theme Options > Customize >Mobile CSS:

    #header-wrap .skinset-header.nv-skin{
    background-size:250px ;
    }

    Thanks!

    Marinske
    Marinske
    Participant

    Thanks, that works.

    Unfortunately, on smartphone, the white teeth don’t work good with the menu text.
    Can we for example place the squirrel a bit lower on smartphone?

    http://www.marinske.com/screenshot/

    Marinske
    Marinske
    Participant

    It might be a worth it to check what it looks like if the squirrek is placed in the middle on smartphone.

    Maybe that will be enough.

    Hi @jezus

    All you need to do is change the background-size value of the CSS I sent to whatever you feel looks best for that image.

    Thanks!

    Marinske
    Marinske
    Participant

    I’m very sorry for the confusion…

    Here are screenshots of tablet & mobile menu.

    I would be very happy if you could help me to place the squirrel in the middle of the menu, on all devices. (see picture “smartphone after” & “tablet after”)
    On mobile device rigthnow it’s impossible to read the last menuitem “shop”. (see picture “smartphone before”)

    I hope this is clearer.
    Thanks a lot!

    Marinske
    Marinske
    Participant

    If you are able to align the picture in the centre, only on mobile device, I would be even happier.
    You choose whats best, all devices or only on mobile.

    Thanks!

    Hi @jezus,

    Do you want it centered at the bottom part? If yes, update the CSS to:

    header-wrap .skinset-header.nv-skin {
        background-position: bottom center;
        background-size: 250px;
    }

    If you want it at the dead center, update the CSS to:

    header-wrap .skinset-header.nv-skin {
        background-position: center;
        background-size: 250px;
    }

    Thanks!

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.