Reply To: Side banners on my website?

[Atelierbram]

Didn’t posted this in other section as I don’t know is CSS related or other.

It is, which you could have seen if you were using Devtools/Firebug.

how can I achieve this?

They are just one image, used as a kind of inline-sprite-image (left-half, right half), in (two) absolute positioned link tags that are toggled visible/invisible with corresponding class-names in media-queries. The trick here is that the wrapper div has no position: relative declared, so the links are positioned to the next relative positioned element up the DOM tree, which is this inner-wrap.

I can have something like clickable background image

Here they are not background-images but just one inline image (in the HTML), but you can achieve this in CSS with the background-size property (with value) on the a element, as long as the wrapper is a <a href=""> link tag …

Would like to advice to make a reduced test case of this, on your machine, or on Codepen , you can start out by making a copy of the Codepen I made with inline images, : you can fork it there and make it your own.