Using CCS for reactive screens

  • Resolved coachman8

    (@coachman8)


    3 years, 4 months ago

    Hi,

    I would like to be able to change the position of the sharing tool on mobiles and desktops and maybe tablets too using CSS. This is because of my website header, it is different sizes on each device. I have had a good play with this but nothing works. Normally I would do this (it is just an example and has nothing to do with your tool):

    @media only screen and (max-width: 768px) {
    .gc-header {
    height: 100px;
    }
    .gc-logo__image {
    width: 190px;
    height: 78px;
    position: absolute;
    top: 10px;
    }
    }

    Can you please tell me how I can get this to work? I would like to be able to change the vertical floating position up and down the page of the sharing widget.

    Thanks,

    Derek

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Author Heateor Support

    (@heateor)

    Hi Derek,

    You can change the top CSS property of the floating bar for different device widths. For example, the following CSS will shift the vertical floating bar down towards the bottom for the devices having screen-width lower than 768px.
    @media only screen and (max-width:768px) {div.heateor_sss_vertical_sharing{top:200px!important}}
    In the similar way you can change the top property of the floating bar for different screen widths.

Viewing 1 replies (of 1 total)
  • The topic ‘Using CCS for reactive screens’ is closed to new replies.

Tags