Css custom shape button [closed]

StackOverflow https://stackoverflow.com/questions/20543801

  •  31-08-2022
  •  | 
  •  

Question

How do I make a custom shape button like this.
example: http://www.dennispkramer.com/index.html
I mean the button saying 'blog' and 'about'.

Was it helpful?

Solution

The actual button is a block, like normal.

enter image description here

However, they've added #nav-mask which looks like this:

enter image description here

Giving the illusion the buttons are like this:

enter image description here

OTHER TIPS

Those are not custom shapes. There is a mask behind the logo, in front of the menu items. There are some CSS tricks to create custom shapes like triangle, but for real custom shapes i would suggest to use SVG.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top