Hi,
I have been sent a design that I need to apply. I tried to do some reverse engineering on the Html and Css but I found it not very easy to read, looking like nested russian dolls
I saw that from a rectangular image they are producing a roundish shaped one using a whole bunch of HTML and CSS and a mix of divs, sgv, etc . Can somebody point to the right direction in order to achieve this with a more readable CSS
I have uploaded the sample I’ve got here .
Use a clip path on the image.
I suck at making them manually, so I typically use a site like https://bennettfeely.com/clippy/
This took about 30 seconds. Obviously not right, but gives you the basic idea of what can be done.
Anytime I need an odd shape image I simply use a png with a transparent background.
The browser will see it as a square image but only show the part that is not transparent.
A PNG file of a photographic image is likely to be much larger than a JPG file of the same image. Especially for large images, the use of clip path is likely to be preferable. (unless partial transparency is required).
Hi, not OP but what if you can is clip path. As stated have not done much web stuff lately. Will again in 2.5 years.
Edit, I found your link. Did not know that kind of stuff was available in css.
Guess in 2 years I will need new book.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.
