• 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

Genesis Child Theme: Simple CSS change turned terribly hard

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 › Genesis Child Theme: Simple CSS change turned terribly hard

This topic is: not resolved

Tagged: css

  • This topic has 5 replies, 3 voices, and was last updated 9 years, 2 months ago by beyond300.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 24, 2014 at 5:40 pm #125598
    beyond300
    Member

    Hello fellow StudioPressers,

    I almost feel silly asking for help on this, because it seems like it should be so easy.

    My website is http://theblogninja.com/

    I am trying to get the green header image centered across the top, AND make it responsive when I change the browser width.

    So far, I have only be able to do 1 of them at a time. When I make the header image centered, then it isn't responsive. When the header image is on the left side (like it is now), then the image is responsive (you can see by dragging in your browser width).

    Anybody have any ideas on how the heck to make it both centered AND responsive? I'm using the Genesis Child Theme.

    P.S. I have tried the WP Sites tutorial and many other guides on I could find on the topic, but none of them worked...

    Thanks!

    http://theblogninja.com/
    September 24, 2014 at 6:05 pm #125602
    Brad Dalton
    Participant

    Please read the forum rules:

    DON’T:
    Post discriminatory, defamatory or derogatory threads or replies. Shout (USE CAPS) or use profanity.


    Tutorials for StudioPress Themes.

    September 24, 2014 at 6:56 pm #125606
    beyond300
    Member

    My apologies, my use of caps wasn't intended as shouting, but rather to emphasize the word "and". I'll make sure to use quotations next time and not caps.

    September 24, 2014 at 8:39 pm #125615
    marybaum
    Participant

    I just looked at your page in Chrome Dev Tools, which has a device emulator. Looks fine to me - it's centered on all the device sizes I looked at.

    Also your CSS looks okay - as if it would produce the result you're going for. The two things I was looking for were:
    You used a percentage to define the width.
    You defined the margin as 0 auto.

    I think you're good to go.

    MB


    Sharing the good news about the wonders of modern CSS and the split-step. Either one should get you moving fast. 😀

    September 24, 2014 at 8:45 pm #125616
    beyond300
    Member

    Hi Marybaum,

    Thank you for double checking that. The only thing I see that happened by adding that code though was that it added a little extra white space under the image. Not sure why though...

    Any ideas on how to get rid of that space?

    September 24, 2014 at 8:53 pm #125617
    beyond300
    Member

    Hi marybaum,

    I actually just figured out how to get rid of it. The space was there for the Site Description, so I just removed it.

    Thanks again!

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 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