WordPress.org

Ready to get started?Download WordPress

Forums

Esquire theme - sidebar menu overlaps with category pages banners (9 posts)

  1. Brett Cooper
    Member
    Posted 1 year ago #

    Please help me figure out how to stop getting an overlap between my sidebar menu, which is always there in my Esquire theme, and each category page banner showing the name of the category (only visible when someone clicks on a category to view all posts associated with that category).

    I searched but couldn't find anyone talking about this problem...

    Thanks in advance for your help!

  2. Brett Cooper
    Member
    Posted 1 year ago #

    My site is: brettcooperwriter.com

    Try clicking on the "ya fiction" link on the left to see the overlapping problem I'm talking about.

  3. D M
    Member
    Posted 1 year ago #

    The sidebar is 'fixed', which means it is positioned according to the browser window in the top/left, but it takes it out of the natural flow of the rest of the html.

    You could go to the style.css, find #header and add:
    margin-left:380px;
    ...which seems to be the width of the sidebar.
    You may have to make some adjustments to that, more or less to get it correct.

  4. Brett Cooper
    Member
    Posted 1 year ago #

    Thanks a lot for your response. I tried updating to this:

    }
    #header {
    background: #ff6 url(img/header-bg.png) repeat-x 0 0;
    margin: 0 0 3.5em -40px;
    margin-left:380px;
    width: 600px;
    height: 6.8em;
    }

    You can see that the third line is yours that I added. I couldn't see any change, though, after saving it. I have now reverted to the original code because I'm nervous about further messing up the formatting if this doesn't fix it. Any other ideas? Do I need to change or delete all or part of the margin code line above it? I'm really a newbie at all of this...

    Thanks.

  5. D M
    Member
    Posted 1 year ago #

    Really?
    Because it worked for me in Firebug.

    Do this:

    change: margin: 0 0 3.5em -40px;
    to: margin: 0 0 3.5em 340px;

    Then "Update File" button.
    Go to page and "refresh"

    ...which is what I did in Firebug and it moved the header in to line with the posts.

  6. Brett Cooper
    Member
    Posted 1 year ago #

    Perfect! You are awesome. Thank you so much. It looks amazing.

    Here's the proof:

    http://www.brettcooperwriter.com/category/ya-fiction/

    Thank again!!!!!

    Brett

  7. D M
    Member
    Posted 1 year ago #

    Glad to help.

  8. D M
    Member
    Posted 1 year ago #

    If this is the one and only change you will ever make, then you can get away with it if you remember it, but it is better to make all you alterations in a Child Theme so that when your theme is updated, your changes are not lost.

  9. millier1
    Member
    Posted 1 year ago #

    Hi Brett - sorry to butt in here - but how did you edit your text bubble on the side of your site? I'm just starting out with Esquire and trying to work out how to get in there and add some stuff in..
    Thanks for any advice,
    Millie

Topic Closed

This topic has been closed to new replies.

About this Topic