Grow your CSS skills. Land your dream job.

Part of background image moves on browser resize

  • # April 12, 2013 at 8:15 pm

    I am working on fixing a theme on vbulletin but I can’t figure out how to get this image to stop moving when the browser width drops below 1280px. you can view the site at http://divineknightsclan.com/forum/.
    here is an image of the problem:

    here is the css of the element:

    .above_body {
    background: transparent url(http://divineknightsclan.com/forum/dknights3/misk/skin/container_top.jpg);
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    }

    # April 13, 2013 at 2:22 am

    Site linked seems to be Flash so I can’t inspect it.

    I’m assuming you want the image centered so `background-position: center top` should work I think.

    # April 13, 2013 at 10:01 pm

    edited top link to reflect forum part of site instead of the flash splash page. sorry for the inconvenience.

    http://divineknightsclan.com/forum/

    On another note, you will have to change the theme by going to the theme selector at the bottom of the page as this is not the current default forum theme.

    As for the background-position: center top, it does not fix the problem.

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".