1
I needed to play the image in css, I tried some options of Transform and I can’t stretch one end.
My question is how to take the bottom of the left and make it bigger downward than the right.
The bottom I did in css with after and before doesn’t look good I just wanted to have a square and stretch one of the tips, should have some way by css
<html>
<body>
<style>
div { width: 320px; height: 335px; border: 1px solid blue; border-radius: 10px 10px 10px 0; position: relative; }
div:before { content: ''; border-right: 318px solid transparent; border-top: 100px solid blue; position: absolute; bottom: -99px; left: -1px; }
div:after { content: ''; border-right: 318px solid transparent; border-top: 100px solid white; position: absolute; bottom: -98px; }
</style>
<div>
</div>
</body>
</html>
The problem is that it has to be css because it will be responsive according to the content, will be several, larger others smaller according to content,
– Dexxtz
@Dexxtz corners can be straight or have to be half rounded as in model?
– hugocsl
has to be rounded equal to this in the example image, really it would have to be css with the rounded corners and the bottom larger than the side
– Dexxtz
SVG can be responsive óras, make geometric shape with
borderis gambiarra. @Dexxtz– Renan Gomes
@Renan is not me who chooses, it is tested even in IE, several Vices that does not interpret svg, so it has to be css =(
– Dexxtz