Tengo esta figura
div{
width:100px;
height:100px;
background:red;
border-radius: 50px 50px 0 0;
}
<html>
<body>
<div>
</div>
</body>
</html>
La quiero invertir y trasladar respetando el espacio, ya lo hice con el siguiente código, pero quería saber si hay alguna propiedad para hacerlo más fácil y rápido(asi sea con una propiedad en 3D
div{
width:100px;
height:100px;
background:red;
border-radius: 50px 50px 0 0;
transform-origin:bottom;
transform:rotate(180deg);
}
<html>
<body>
<div>
</div>
</body>
</html>
transform-origin: bottom;
¿O estás buscando otras alternativas a parte detransform: rotate();
?