Hello new to blocs so I am unsure if this has been asked before, but I am curious to know if it is possible to overlay images or text on top of each other. In the image I attached I want to add text in each of the places where the red boxes are but it seems like I can only add a text bric underneath the image. Thank you.
Hello @cleophus, Welcome to the Blocs community! Assuming you want to do this to creates links (if not the easiest route will be amending the picture itself). There are several ways in doing but the easiest is probably the following:
Creat a bloc with a 1-column structure. Add a bric with a 3-column structure in the Bloc just created and duplicate this bric twice. In the centre, column add an image bric and add your compass. add in the column around it a header bric (h1-h5). Set to each of the header a custom class. Open the class editor by double-clicking on the custom class just created and open the “margin/padding” tab. Set a margin for the edge you wishes to move. These margins can be negative as well.
2 Likes
I would approach this using flex. This is possible without code, just using the Class editor. You will get a reasonable amount of responsiveness doing it this way.
Here is the example file
Text_Overlay_Example.bloc (742.0 KB)
4 Likes
If I am unfamiliar with using flex is there anywhere I can go to figure out how it’s used?
Hi @cleophus, Just download @PeteSharp’s and file you can can see how it’s applied by clicking on the classes used for each DIV container. More info on how flex works and what it can do you can find here.
Hi Jerry, thank you for the help.
1 Like
Hello, not sure if I am doing something wrong but when I follow the setup from @PeteSharp’s file. My div containers are showing up underneath the image rather than overlaying the image like in his example, any pointers?
Hi @cleophus, Each DIV container has 2 classes applied in @PeteSharp file. On you screenshot the main one which does the layout seems to be missing .
Please PM me the file.
Hello Jerry, unfortunately the forum will not let me upload the file because I am too new of a user nor will it allow me to send a direct message. But, maybe you could pm an email address that I could send my file to?
Sent to you!