CODEWITHSUNDEEP
css
Shimmy Weitzhandler
Shimmy Weitzhandler

Reputation: 104692

CSS border-radius direction

I have a request to make these menu items:

Top menu:
enter image description here

Side menu:
enter image description here

I started with a border-radius, but I don't know how to make the other side to be 'outer radiuses', I believe both the top and bottom menu are mainly the same idea, I'll just have to play with the sizes and directions.

I'll soon share a jsFiddle of a version I'm working on, currently I haven't manage to do anything at all.

Upvotes: 3

Views: 1291

Answers (1)

sachleen
sachleen

Reputation: 31121

Essentially you want to use the :before and :after selectors to create a little box with a border radius in the corners you want.

There are many examples online, here are a few:

Upvotes: 2

Related Questions