• Resolved SusanRC

    (@susanrc)


    Hi Kyle —

    Quick question. There is a large space at the top of every page, below the header, before the text is rendered. I would like to move the text up higher on the page, closer to the bottom of the header. I commented out the content padding in style.css which moved it up a little but I would like to close that gap. How can I accomplish this?

    Thanks,
    Susan

Viewing 15 replies - 1 through 15 (of 25 total)
  • Theme Author Kyle Gabriel

    (@kizniche)

    Susan,
    Coincidentally, I just did this right before I saw this post. What I did was edit style.css and change:

    .site-content {
        margin-bottom:4em;
        margin-top:40px;
        //margin-left:1em;
    }
    
    .content-area {
        padding: 2.0em;
    }

    to:

    .site-content {
        margin-bottom:4em;
    }
    
    .content-area {
        padding: 0 2.0em;
    }

    Thread Starter SusanRC

    (@susanrc)

    Kyle —

    This is really weird — when I’m logged in to WordPress the above changes work perfectly. However, when I look at the page in the localhost when I’m logged out of WordPress the space returns and the content moves down lower on the page. I have 3 pages (Home, Contact and About) and one posts category in the menu (which displays the excerpts of my posts). When I look at the category page (or the search results page) it is the same whether or not I’m logged in but the 3 Pages act differently depending on my login status. They each have an EDIT link at the bottom of the page when I’m logged in but not if I’m logged out — could that be affecting the location of the page content? Is there some way I can include screen shots?

    Theme Author Kyle Gabriel

    (@kizniche)

    Susan,

    I’m experiencing the exact opposite of what you describe. When I’m logged in, there’s extra space missing, but when I’m logged out, everything looks fine. Maybe you said it backwards? In any case, I’ve overlooked it because it was a minor inconvenience to me. I found that it is the Edit code that’s causing it. I haven’t looked deeper, but I will today. Since the ‘Edit’ link near the bottom is redundant if you have the top bar, you can remove the bottom edit by altering content-page.php and changing:

    <footer class="entry-footer">
        <?php edit_post_link( 'Edit', '<span class="edit-link">', '</span>' ); ?>
    </footer>

    to

    <footer class="entry-footer">
        <?php //edit_post_link( 'Edit', '<span class="edit-link">', '</span>' ); ?>
    </footer>

    Thread Starter SusanRC

    (@susanrc)

    Isn’t this just crazy! OK — no — I said it right. Logged in, all is well (EDIT link at bottom of page). Logged out — too much space at the top of the page. Tried your fix — now, logged in or out, too much space.

    Also, the EDIT link on a post page is at the top. I’d like to remove that one too.

    Fun fun fun ??

    The reason I want to fix it is because I want the Page header to be visible without so much white space when someone hits the site (once it’s live, that is).

    Theme Author Kyle Gabriel

    (@kizniche)

    I’m stumped!

    I compared the two pages, and literally, the only difference that’s needed to change the layout like we’ve experienced is the <a href...</a> code. Not the classes, not the footer. It’s merely the link itself.

    I’ve never seen anything like this before and have no idea how to fix it, besides from the edit above. I think I will make this a permanent change for the next version.

    If anyone more skilled than I could diagnose this, I’m curious to know why.`

    Theme Author Kyle Gabriel

    (@kizniche)

    Do you have a link?

    It’s even stranger that we’re experiencing the exact opposite behavior. What first comes to mind is a plugin may be to blame.

    Theme Author Kyle Gabriel

    (@kizniche)

    Is there a space between the header and the first bit of text on my site kylegabriel.com?

    Theme Author Kyle Gabriel

    (@kizniche)

    To remove the edit on the post page, edit content-single.php and change:

    <div class="meta-list">
        <?php atomic_display_categories(); atomic_comment_count(); atomic_display_edit(); ?>
    </div>

    to

    <div class="meta-list">
        <?php atomic_display_categories(); atomic_comment_count(); //atomic_display_edit(); ?>
    </div>

    Thread Starter SusanRC

    (@susanrc)

    Thinking out loud here — in my case it almost makes sense — logged out, no EDIT link, too much white-space at the top. Logged in with above change, no EDIT link, too much white-space at the top. In both cases my whole page moves down as if it’s trying to fill up a certain amount of space — once the EDIT link is gone there is less context and the whole thing moves down to better fill the empty space.

    Is there some style that boxes the div and centers the content inside with a certain amount of padding or borders?

    Thread Starter SusanRC

    (@susanrc)

    Yes, there is the same amount of extra white-space at your site. The only Plugin I’m using is JetPack and the only thing I used so far is the Contact Page Form.

    Thread Starter SusanRC

    (@susanrc)

    I don’t have a link because I’m working in MAMP on my laptop for now. I wanted to work out the styles and all before I created a live site.

    Theme Author Kyle Gabriel

    (@kizniche)

    That makes sense.

    Perhaps I’ve already changed some of the spacing myself but couldn’t remember which, so my layout may be slightly different than yours, even considering the changes I mentioned above. I can send you my entire style.css and you can compare it with yours. Also, don’t rule out any plugins that may be to blame. I always recommend disabling all plugins to exclude them from being at cause.

    Theme Author Kyle Gabriel

    (@kizniche)

    I’m investigating your theory now…

    (but first let me grab a beer)

    Theme Author Kyle Gabriel

    (@kizniche)

    Susan,

    I compared my style.css files and the only difference from the stock Atomic 1.5.1 is this change:

    @media screen and (min-width: 1000px) {
    .entry-header,.page-header {
        float:left;
        width:95%
    }

    to

    @media screen and (min-width: 1000px) {
    .entry-header,.page-header {
        float:left;
        width:95%;
        padding-top: 3em;
    }

    See if that fixes the spacing issue (with the Edit link removed)

    Thread Starter SusanRC

    (@susanrc)

    Sadly, no. I have removed the edit link and added the padding-top code from your last post but still have the extra white space.

Viewing 15 replies - 1 through 15 (of 25 total)
  • The topic ‘Page Content location’ is closed to new replies.