#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2013
    Posts
    2
    Rep Power
    0

    Need help with hover


    I'm having troubles with a "social bar" I'm creating. When I add the "hover effect" on my workstation PC which has a resolution of 1920x1080 the hover looks good and in place but when I look at it on my other PC with a res of 1600x900 it looks out of place by a few pixels around 5px. Is this normal? I'm using Firefox as browsers which are up to date.

    Thank you
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    298
    Rep Power
    8
    Good evening,

    Are you setting your widths/heights with pixels or percentage?

    Have you got a live link?

    I've got a 1680x1050 and a 1280x800 max so I can have a look through both for you.

    Kind regards,

    NM.
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2013
    Posts
    2
    Rep Power
    0
    Originally Posted by Nanomech
    Good evening,

    Are you setting your widths/heights with pixels or percentage?

    Have you got a live link?

    I've got a 1680x1050 and a 1280x800 max so I can have a look through both for you.

    Kind regards,

    NM.
    Hi, I believe with pixels, currently don't have a live link.

    #fb {
    display: block;
    position: absolute;
    top: 0px;
    left: 50%;
    margin-left: -65px;
    width: 184px;
    height: 75px;
    margin-top: 312px;
    z-index: 9999;
    opacity: 0;
    transition-property: all;
    transition-duration: 0.2s;
    transition-timing-function: ease-in-out;
    transition-delay: 0s;
    background-color: transparent;
    background-image: url(IMAGE URL HERE CANNOT POST LINK);
    background-repeat: repeat;
    background-attachment: scroll;
    background-position: 0% 0%;
    background-clip: border-box;
    background-origin: padding-box;
    background-size: auto auto;
    }
    #fb:hover {
    background-position: right top;
    opacity: 0;

IMN logo majestic logo threadwatch logo seochat tools logo