Skip to main content

Forums

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #294080
    guillaume
    Participant

    Hello ,

    I’m having a hard time making “Sticky” position work on my div ID “Product Info” as seen on this page: https://css-tricks.com/position-sticky-2/

    Here is the URL of the page :
    https://8ljrib4sm1t7tp24-2268856383.shopifypreview.com/products/bamboo-toothbrushes

    And the added CSS :

    #productInfo-product {
    margin-top: -55px;
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position: sticky;
    top: 0;
    }

    I would gladly have your opinion on the problem, thanks a lot.

    #294116
    uxfed
    Participant

    It’s working. It just won’t do anything unless the other column has more content, otherwise your info block has nowhere to go.

    To confirm this, I went in to devtools and just put lots of content in the left column and started scrolling.

    #294755
    guillaume
    Participant

    Thanks a lot. I see, you’ve been a great help.

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.