Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

Logo not displaying properly on mobile

    • 8 years, 11 months ago charlesmalolo
      Participant

      Expired

      Our logo is not displaying properly on mobile. It is going off and not resizing. What’s the best way to fix this?

      Our site: https://mckinneyestateplanning.com/

    • 8 years, 11 months ago Kris
      Participant

      Hello,
      Please add this code to your custom CSS box:

      @media (max-width: 480px){
      #logo img {
          height: 83px;
          margin-top: -36px;
      }
      }

      Let us know.
      Best regards!

    • 8 years, 11 months ago charlesmalolo
      Participant

      Expired

      Hmm, that didn’t seem to work, and it made it a bit worse as it’s now just moved down.

      This is the screenshot with the custom css added:

      goo.gl/MoUB5p

      And this is before:

      goo.gl/XPKaQc

      Any other ideas?

    • 8 years, 11 months ago Kris
      Participant

      Hello,
      Please add !important to the height attribute:

      @media (max-width: 480px){
      #logo img {
          height: 83px !important;
          margin-top: -36px;
      }
      }
      

      This is what i get when i add this code: (https://www.awesomescreenshot.com/image/1452120/9c4ab9ab98238716e1efdc140497c97b)
      Let us know.
      Best regards!

    • 8 years, 11 months ago charlesmalolo
      Participant

      Expired

      Perfect. That worked. Thanks! High five!

    • 8 years, 10 months ago charlesmalolo
      Participant

      Expired

      Hi there! We reuploaded the image file for our logo and now it’s having the same problem of not being centered and going off the screen. I checked the custom css box and it still has the exact code you posted previously for us to insert. Any idea how to fix it? Thanks!

    • 8 years, 10 months ago Mirela
      Participant

      Hello,

      Is this image you uploaded, bigger than the previous? However, you only need to change the values of the last code, to match this new logo. I tried with these values:

      @media (max-width: 480px){
      #logo img {
          height: 60px !important;
          margin-top: -18px;
      }}

      This is what i get: screenshot.
      Let us know.

      Note: Please consider updating your profile data. Read this article for more information.

      Best regards!

Viewing 6 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password