Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 18, 2016 at 9:55 am #674092
    schiffbauer00

    Hi,
    I have a minor issue adjusting the logo in mobile view. It is too much to the top of the header…
    I did the following to adjust the logo:

    .logo img { margin-left: 80px; }

    strong.logo img {
    padding-top: 10px;
    }

    @media only screen and (max-width: 989px) {
    .responsive #top .logo {
    margin-left: 80px;}
    }

    @media only screen and (max-width: 767px){
    .responsive .logo img {
    margin-bottom: -20px;
    margin-top: 20px;
    }
    }

    The last part is for the adjustment in mobile view and here is the problem.
    The position is Ok, but because of the “margin-bottom: -20px;” a part of the logo is cut of now.
    What is a better work around?

    Thanks!
    Jan

    August 19, 2016 at 8:21 am #674578
    Rikard

    Hi Jan,

    Could you provide us with a link to the site in question so that we can take a closer look please?

    Best regards,
    Rikard

    August 19, 2016 at 9:54 am #674610
    schiffbauer00

    Hi Rikard,

    thanks for your reply!
    Find the link below…
    As I said, the position of the logo is quite OK. But in the mobile dimensions I can not shift it down a little while not cutting off some part at the bottom..

    August 19, 2016 at 12:29 pm #674719
    Vinay

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file: 

    @media only screen and (max-width: 767px) {
.responsive #top .logo {
    height: 120px !important;
    }}

    Best regards,
    Vinay

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.