I'm not sure how do I approach this problem
I tried to use position: absolute on a element and place it on top of the header and side bar but it doesn't look good
Asked
Active
Viewed 49 times
0
-
For something like that, an SVG as background would be much easier, you have little circles and flying bird too, again very SVG.. – Keith Mar 09 '23 at 09:46
-
@Keith I strongly disagree. SVG is semantically, for accessibility reasons and responsiveness the wrong approach. It is a design issue that should be solved at the CSS level with the usage of `clip-path`, `mask`, or `pseudo-elements` which are all not visible to screen readers. – tacoshy Mar 09 '23 at 10:08
-
@tacoshy That's up to you!!, but I'm not sure your reasons make sense. SVG are intrinsically responsive, and accessibility is no less with SVG's. If your unsure how to make accessible SVG you might find this helpful, -> https://css-tricks.com/accessible-svgs/ – Keith Mar 09 '23 at 13:50
-
@Keith I know what you mean but with shifting size and content it will be squashed. It scales well but not necessarily remain the border-radius correctly if the aspect-ratio changes. Also, using for designing purposes, not for the purpose of actually displaying a picture is accessibility-wise incorrect. – tacoshy Mar 09 '23 at 14:48