Responsive Center Logo

Homepage › Community Forums › Epik Theme Support › Responsive Center Logo

Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • November 24, 2015 at 11:02 pm #16776
    caroline
    Customer

      I’ve read a number of posts in this forum and tried a few for this issue. I’ve added below to my css but still unable to have my logo center on mobile. It also sizes differently in Safari vs Google. I can live with that. But would like to resolve the centering issue. Finally got the fuzzy logo resolved with help on the forum, but we had to upsize and reduce logo display to 60% in css. When we did this, responsive centering issues returned. Suggestions welcomed. http://bit.ly/1T48sMc

      .site-header .site-title a {
      background-position: center top !important;
      float: none;
      }

      November 25, 2015 at 1:50 am #16778
      Andykev
      Customer

        I would go back to the width 100% or you could try 90%: (line 2055)

        .header-image .site-title a {
        float: left;
        min-height: 164px;
        width: 100%;
        }

        I looked and didn’t find this bit of code at the bottom of your css. This added code shrinks your logo when viewed on small screens:

        .header-image .site-title a {
        background-size: contain !important;

        I just tried it on your site (using Chrome) and it looked fine, centered, and sharp image.

        馃檪

        November 28, 2015 at 9:11 am #16793
        caroline
        Customer

          Thank you Andy. I’ve added this at the bottom. The logo is still too large in the header. I changed back to 90%. Using the same logo as used in the footer, but much larger in the header. I’ll keep working on this.

          November 28, 2015 at 2:39 pm #16794
          Andykev
          Customer

            I think you have it just about right. If you go to this nifty website and enter the URL for your website, it gives you a view (test) image on any device. Great to see how your site looks on different devices.

            http://responsivetest.net/#u=http://www.loyelstudios.com/|640|1136|2

            Happy Thanksgiving!

            November 28, 2015 at 3:21 pm #16795
            caroline
            Customer

              Thank you, Andy. The header logo is too large. You mentioned to change back to 100% or no lower than 90%. (We previously had this at 60%) I have it at 90% but the header logo is too large. And, if centered on mobile I believe the “Y” should be over the hamburger mobile menu. The logo is a bit off-right. Before we moved it slightly to the right in Adobe, but you suggested I not do this when we uploaded the larger logo needed to eliminate the fuzzy issue.

              So I’m still trying to center the logo in mobile and make the logo smaller. We eliminated the fuzzy issue, so that’s good.

              Happy Thanksgiving to you too. I hope you had a nice holiday. Thanks, as always for your help.

              November 28, 2015 at 9:56 pm #16798
              caroline
              Customer

                I changed back to 75% till I can resolve. 100 and 90% were too large. So if you check it out I’ve set back to 75 for now.

                Thanks,

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