How do I resize a block on hover so that other blocks don't go away?

  • 0
    Help make beauty! ))
    There are product cards, when hovering, characteristics and the add to cart button should appear, but other blocks should not leave.

    https://fex.net/en/s/vtf1apv - this is an example of how it should be

    When you hover in this example, everything is in place and only the card on which the hover is increased.

    As for me, it turns out that when you hover over a card, it enlarges and shifts other cards.

    https://fex.net/en/s/3tt8osc - here's an example of what I have now < br />
    Help me figure out how to enlarge the card without affecting the rest
    JavaScript Anonymous, Jun 6, 2019

  • 3 Answers
  • 0
    https://jsfiddle.net/6yp1vmc2/



    or do not specify a fixed height when hovering, but do auto. If content can be dynamic quantity
    Theodore Noble

  • 0
    The card container with position: relative, and the content itself needs to be placed in a block with position: absolute.

    Absolutely positioned elements will not affect the position of others.
    Anonymous

  • 0
    I should have looked at the code, I should have put in https://jsfiddle.net or similar.

    It's easy to do, the above people wrote under the nickname twolegs .

    You just need the block to be superimposed on top of another and that's it.
    Anonymous

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!