how to make background picture fixed?

Discussion in 'Themia WordPress Theme' started by alexanderberntsson, Mar 13, 2013.

  1. alexanderberntsson

    alexanderberntsson New Member

    Joined:
    Dec 24, 2012
    Messages:
    22
    Likes Received:
    0
    Its very disturbing that the background picture keeps changing size when I visit my website on different monitors...On some computers I cant read the text because the background picture changes size depending on what size the screen has... Can I in some way make the background picture fixed (so it stops changing size)?
     
  2. Nitesh

    Nitesh Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    5,165
    Likes Received:
    160
    Hello,

    For this you need to make your background image fixed for all screens.
    First go to Appearance > General > Body background image and remove your background image from there.
    After this paste this code in Custom CSS
    Appearance > Theme Option > Styling Option > Custom CSS

    Code:
    body {
    background: url(your image address) no-repeat center center fixed!important;
    -webkit-background-size: cover!important;
    -moz-background-size: cover!important;
    -o-background-size: cover!important;
    background-size: cover!important;
    }
    
    Add your image address in first line of code.
     
  3. alexanderberntsson

    alexanderberntsson New Member

    Joined:
    Dec 24, 2012
    Messages:
    22
    Likes Received:
    0
    didnt work, should it still say url or should I remove url...should the url be separated with coma or in a ()?
     
  4. Gourav

    Gourav Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    7,728
    Likes Received:
    207
    Do let us know your website link.
     
  5. alexanderberntsson

    alexanderberntsson New Member

    Joined:
    Dec 24, 2012
    Messages:
    22
    Likes Received:
    0
  6. Nitesh

    Nitesh Support Staff

    Joined:
    Oct 19, 2012
    Messages:
    5,165
    Likes Received:
    160
    Dashboard detail you have sent is not working. Never post your detail at the open forum.

    Follow process for solution.
    First go to Appearance > General > Body background image and remove your background image from there.
    After this paste this code in Custom CSS
    Appearance > Theme Option > Styling Option > Custom CSS

    Code:
    body {
    background: url(http://jobbjobbjobb.com/filmpresentation/wp-content/uploads/2013/03/gulbakgrund2.jpg) no-repeat center center fixed!important;
    -webkit-background-size: cover!important;
    -moz-background-size: cover!important;
    -o-background-size: cover!important;
    background-size: cover!important;
    }
     

Share This Page