Enlarged logo image position on mobile (iphone) view covers layer slider

This topic has 1 reply, 3 voices, and was last updated 10 years, 11 months ago by Whitt Madden.

Viewing 4 reply threads

Author

Posts
- at #62772
  
  Louise Cuschieri
  Member
  
  Hi,
  
  See: http://wizarddesign.com.au
  
  I’ve enlarged the logo through custom.css as follows:
  
  #theme-logo { padding:0!important;}
  
  #theme-logo img {
  height:200px;
  width:200px;
  max-height:200px!important;
  max-width:200px!important;
  }
  
  It shows fine on wide screen and it would have looked fine on my iphone were it not that it almost completely covers the layer slider. Is there any way where I can define in the mobile template for the logo to be shown ABOVE the layer slider, instead of overlaying it?
  
  Thanks,
  Louise
- at #62776
  
  Whitt Madden
  Member
  
  Have you updated to the 1.2 version that was released last week? My logo is 125×125 and seems to work fine on mobile devices. I was just curious if the update makes a difference for you?
- at #62777
  
  Louise Cuschieri
  Member
  
  Yes, I downloaded and installed version 1.2 on 19 February 2014.
  
  I want to keep my logo in this size, but I don’t want it to overlay my Home page slider on mobile view. How can I avoid this?
  
  Thanks,
  Louise
- at #62779
  
  Anonymous
  Inactive
  
  your code above will work on all screen sizes.
  
  try to add this
  
  @media handheld, screen and (max-width: 768px) {
  #theme-logo img {
  height:100px;
  width:100px;
  max-height:100px!important;
  max-width:100px!important;
  }
  }
  
  that way, if it’s on a small device, your logo will become smaller
- at #62826
  
  Louise Cuschieri
  Member
  
  Excellent! That worked perfectly. 🙂
  
  Thank you once again!
Author

Posts

Viewing 4 reply threads

You must be logged in to reply to this topic.