Positioning an image at the absolute top of the content area

  • tkeiger

    #8985

    Hi! New to the forum & to the Graphene theme (but loving it!)

    I have an image that I would like to position at the absolute top of the content area, so that it abutts the menu bar above. I’ve made some incremental progress with the child theme css, but I’m not there yet. This will only be on the opening page of the site.

    http://pseudo-quasi.net/ – the vertical image on the right (development site, so everything is still really rough)

    thanks so much!

    Mod

    Kenneth John Odle

    #42516

    Try

    .home .entry-content img {
    border: none;
    margin: 0;
    }

    tkeiger

    #42517

    Thanks for the quick response, but I’m afraid that didn’t work. The modifications that i’ve made so far:

    #content {
    background: #e3e3e3;
    padding-top: 0px; /*decreases top space at content*/
    padding-bottom: 20px;
    }
    .home .entry-title, .entry-title a {
    display: none;
    padding: 0;
    }

    .home .entry-content img {
    border: none;
    margin: 0;
    }

    .post {
    background: #fff;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #d8d8d8;
    margin-bottom: 10px;
    padding: 0px 0 10px; /*decreases top space at content*/
    overflow: visible;
    position: relative;
    width: 100%;
    }
    Mod

    Kenneth John Odle

    #42518

    Try wrapping that image in a <div> with a unique ID and then applying a negative top margin to it. Hacky, but it works.

    tkeiger

    #42519

    Not hacky when it works! (and I’d initially done something similar, but w/out the negative top margin). That also moved the content up, so I created a class to give it some padding (as I’d also wanted to increase the side margins anyway). For those playing along at home, the new css:

    .openimage {
    margin-top: -7px;
    }
    .opencontent {
    padding: 30px
    }

    thanks so much! Off to tinker!

    Mod

    Kenneth John Odle

    #42520

    If that’s the only place you want to do that, you might want to use a css id instead of a css class.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

Do NOT follow this link or you will be banned from the site!