Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Changing shape of hexagon to square when :hover

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #200877
    andreadardon
    Participant

    Hi!

    I saw this code pen of an octagon (wrongly called hexagon) turning into a square when hovered on. I wanna recreate that on a 300px sized hexagon, but I’ve had trouble knowing what exactly it is that makes the transformation.

    This is the codepen: http://codepen.io/EdwinToh/pen/ktaxH

    Thanks a lot!

    #200878
    Paulie_D
    Member

    Actually, it’s not changing shape at all.

    What’s actually happening is that the internal (bubble) div is rotating. The reason you can’t see the ‘cut-off’ corners is due to the overflow being hidden on the parent div.

    I’ve removed that and put a border on the parent so you can see what is actually happening.

    http://codepen.io/Paulie-D/pen/QbWwqx

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.