This section is for posting questions which are not directly related to WYSIWYG Web Builder.
Examples of off topics: web server configuration, hosting, programming related questions, third party scripts.
Note that these questions will generally not be answered by the administrators of this forum.
How to do a layering of images in Layout grid or flexbox for example
The man laying on the sofa is one image the half cut solid nevy blue solid background on top is another image png or svg. And then on top of those we can see the text and button.
The reason wanting to layer those images is because I would like to adjust them even in breakpoints so instead of everything in the middle in mobile device the viewport shows only the man and not the solid nevy blue background which I would be able to remove in breakpoints.
So the task is how to do it...
Last edited by wwonderfull on Mon Jul 04, 2022 10:28 am, edited 2 times in total.
I did not optimize it for a bunch of breakpoints in the demo but you could tweak it in such a way to get the text to look correctly for different breakpoints.
I did not optimize it for a bunch of breakpoints in the demo but you could tweak it in such a way to get the text to look correctly for different breakpoints.
I did not optimize it for a bunch of breakpoints in the demo but you could tweak it in such a way to get the text to look correctly for different breakpoints.
I was in the same process
understood how you did it crispy the layout grid had the background and the col1 had the solid one. I think you had used fixed width for col1?
Btw thanks for the demo.
understood how you did it crispy the layout grid had the background and the col1 had the solid one.
Yes, that is correct. I also set the background image size to 300% (just type 300% in the size box) since it is a svg.
I think you had used fixed width for col1?
It is only 1 size in the demo as I didn't add a bunch of breakpoints. I probably wouldn't make it a "fixed" size as you may need to adjust that column for smaller screens as it also controls the width of the text. I also added some interior padding to that column to move the text over.