Answered. Thanks.

[Xeiwa]

?

There's a panel I wanna mess around with and I was wondering if it's possible to do that.
o:

[if it is, may I please know the code?]

[Zzyli]

You can certainly do that. You'll need to work with the border-radius property. Because you only want part of your panel to be curved, you'll need to specify which corners you want to use it on in full. You're wanting the top right and bottom right corners to be curved, so you can use something like

#selector{border-top-right-radius: __px; border-bottom-right-radius: __px;}

The selector is the selector for the panel(s) you want to target with this, and you can change the numbers to experiment with the curvature. The bigger a number, the more of the panel will be curved.

So, if you wanted to apply this to your about section, you could use
#id_about{border-top-right-radius: 10px; border-bottom-right-radius: 10px;}

Again, you'll need to play with numbers a little to figure out what looks nicest for you.

[Fredy-san]

Zzyli

You can certainly do that. You'll need to work with the border-radius property. Because you only want part of your panel to be curved, you'll need to specify which corners you want to use it on in full. You're wanting the top right and bottom right corners to be curved, so you can use something like

#selector{border-top-right-radius: __px; border-bottom-right-radius: __px;}

The selector is the selector for the panel(s) you want to target with this, and you can change the numbers to experiment with the curvature. The bigger a number, the more of the panel will be curved.

So, if you wanted to apply this to your about section, you could use
#id_about{border-top-right-radius: 10px; border-bottom-right-radius: 10px;}

Again, you'll need to play with numbers a little to figure out what looks nicest for you.

Or you can just use shorthand border-radius:0px 10px 10px 0px;
It starts clockwise from top left - top right - bottom right - bottom left.

Btw, If you look carefully at the picture, the bottom corner is more eclipse-slanted arc than the top one which more circle.
It means it requires a bit more adjusting, example shorthand code:
border-radius:0px 65px 95px 0px / 0px 65px 65px 0px;

will create that shape exactly just like that picture where the bottom one is more eclipse. Notice the increase px I added there.

[Xeiwa]

Zzyli

Fredy-san

Thank you very much for the help.
4laugh