Tagged: enfold, Text block
Hi I am trying to create within a 1/3 column a text block which should appear with a round coloured background, in the same manner of an image with styled as a circle. I tried to create a css rule which gives the background to the text, but I was forced to give specific measure to it. Hence if I have three 1/3 columns, the responsiveness doen’t work well.
Then I tried to use buttons to which I gave a css rule to make them circled, but though the system works better, but I still have problems as the text may take more than 1 line and it is difficult to center it unless I do not create single rules. Also if I want a circle not appearing with a link I would have problems as buttons are always linked to an url
Have you some suggestions? The best for me would be to go back to the first idea, but I did not solve the problem that the circle should be big in wide screens and decrease the shape in smaller devices, in the same manner that circled images do.
Thanks
this could be a nice example for you: https://codepen.io/nuriarai/pen/uIrFf
because the row on top is nearly responsive !
Hi @elenapoliti,
Did you try out the code @Guenni007 suggested and did you have any luck with it?
Regards,
Rikard
Hi @rikard, thanks and thank you @guenni007, the code works! However I am finding out the way of centering a code block in a 1/3 layout content element. It is aligned on the left.
@rikard everything is fine: I solved it
Hi,
Glad that you have solved it. :)
Best regards,
Nikko