• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Why Does My Site's Header Image (Logo) Misalign?

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Why Does My Site's Header Image (Logo) Misalign?

This topic is: not resolved

Tagged: header image, Logo, parallax

  • This topic has 3 replies, 2 voices, and was last updated 7 years, 6 months ago by emasai.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • September 22, 2015 at 8:55 am #166351
    Kabolobari
    Member

    Hi, can someone pop in and check my new site at Cimnethub.com? Please see how the logo is pushed far left top. I did adjust the size of logo I want from the default 360/70 to 180/35, because I want the retina on mobile to be 360/70. That and some changes in CSS to match. So I was very surprised when I uploaded the logo to header image and it's squished the way it is.

    I'm not sure I see where to adjust anything to make it balance in the middle to align with the navigation menu list items.

    Could someone check and direct me properly? Thanks.


    KB

    http://cimnethub.com
    September 22, 2015 at 12:59 pm #166382
    emasai
    Participant

    Not quite sure what you mean by misalign. It doesn't look squished to me on iMac in Chrome, Safari or Firefox, and it looks like it is center aligned with the nav.

    P.S. Float: center; does not exist, it's either left or right. To center an element within its container use margin: 0 auto;


    Need Website Customization or a Responsive CSS fix? Contact Me
    Lynne emasai.com

    September 23, 2015 at 2:09 am #166430
    Kabolobari
    Member

    Hi, Emasai, I kinda fixed it though, with padding-top. However, I'm quite displeased with the look (dull, annoying) of the logo on mobile. I've noticed it's this way with all StudioPress themes--horrible looking mobile menu. The tiny low-res logo sits on top of those three slats hamburger menu. It's annoying. Check out Studiopress.com and mobile and see how they carefully align things, high-quality logo to the left and hamburger menu to the right. Well-placed. Why can't the Genesis guys transfer the same thing to the child themes?


    KB

    September 23, 2015 at 9:14 am #166459
    emasai
    Participant

    You can get the same effect by changing the width of the 2 header widgets and floating the title-area left and the responsive icon right. There are a few other css tweaks you will need to make to get the same effect. You can also increase the size of the hamburger by increasing the font size in .responsive-menu-icon::before it is set at 24px now.


    Need Website Customization or a Responsive CSS fix? Contact Me
    Lynne emasai.com

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble