Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • October 23, 2014 at 11:19 am #339999
    Munford

    Hi
    I am testing the new update of Enfold on this site:

    and everything seems fine except the logo on the mobile header is displaying wrong – looks like it’s only 80% in width. (http://imgur.com/Pb9xqcS) I used this css to position the logo which shouldn’t change the aspect ratio:

    @media only screen and (max-width: 767px) {
    .responsive .logo a, .responsive .logo img {
    height: 55px !important; margin-top: 3px!important;}
    .responsive .logo { margin-left:-10px!important; }
    }

    It was fine on version 2.9.2. (should look like this: http://imgur.com/EXUh1g8)
    Can you help me with this?

    Also – are there other changes to the 3.0 version that I should be aware of regarding an older site? I am always a bit wary of updating, as I have had problems with plugin compatibility (WPML), but I understand it’s important to do it, right? At what point can a site just keep running on an old version?
    thanks
    Nancy

    • This topic was modified 8 years, 7 months ago by Yigit.
    October 26, 2014 at 10:58 pm #341166
    Munford

    any ideas?

    October 27, 2014 at 8:20 am #341344
    Ismael

    Hey!

    Thank you for using Enfold.

    The logo looks fine when I checked it. Just need a few adjustments:

    @media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo img {
height: 75px !important;
margin-top: -10px!important;
}
}

    Yes, it is important to update the theme on a regular basis unless you’re not planning to update WordPress at all.

    Cheers!
    Ismael

    October 27, 2014 at 10:06 am #341400
    Munford

    HI Ismael

    I tried that code with no change – the loog is getting squashed: http://imgur.com/I1Nfu1c
    is that what you are seeing also? I cleared the cache…any ideas? looks like it’s set at 80% width or something
    thanks
    Nancy

    October 28, 2014 at 12:27 am #341882
    Yigit

    Hi Nancy!

    You have following code in Quick CSS

    @media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo img {
height: 75px !important;
margin-top: -10px!important;
}}

    Please remove “height: 75px !important;” from this code and it should work fine. Please do not forget to disable CSS minifying feature before applying changes
    Cheers!
    Yigit

    October 28, 2014 at 12:42 am #341901
    Munford

    thanks! I knew it was something easy.
    that fixed the aspect ratio but the logo is a bit smaller than it used to be –
    can I increase it but keep it in the same position?

    I don’t use the minifying feature – should I?
    I think I ran into problems a few months ago with that.
    Nancy

    • This reply was modified 10 years ago by Munford.
    October 28, 2014 at 12:46 am #341904
    Yigit

    Hi!

    You can use it but if you do, please disable it before adding custom CSS code or when you make styling changes and then re-enable so changes can be applied.
    You are welcome, always glad to help!

    Cheers!
    Yigit

    October 28, 2014 at 12:56 am #341916
    Yigit

    Hey!

    Please add following code to Quick CSS as well and adjust as needed

    @media only screen and (max-width: 767px) {
.responsive .logo { width: 90%; }}

    Cheers!
    Yigit

    October 28, 2014 at 10:05 am #342098
    Munford

    excellent thanks so much!

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘mobile header changes’ is closed to new replies.