2 questions about PRO

[vlntnt]

Hi, I have 2 small questions to ask:

The first one is, I have the current section

My aim is to have 4 even circular sections with some text on them. The way I made it is I created 2 columns added text with background and selected maximum radius. However they remain circiular only with specific margin and paddings and when the display size shifts the circular shape changes into something else. I want to have them as circles on every different screen size, ideally to stack on top of each other when on mobile and etc.

The second question is when I insert an image, is there a way the image to be replaced with different one when hovered, and then goes back to the old one when not hovered. And also a slight zoom in when hovered and then zoom out to original size when mouse is out of the image.

Thanks

[ruenel]

Hello @vlntnt,

Thanks for writing in!

1.) The column must be in the same width and height or a perfect square so that you can achieve a perfect circle. I would recommend that you remove the border radius and background color in your column settings. Please do it in your text element settings instead. What you would do is to set the background color, add some padding, set the border radius to 50% and then add a maximum width and height by adding this inline element css

$el {
  max-width: 350px;
  min-height: 350px;
}

You will have a perfect circle with a dimension of 350 pixels wide.

2.) Regretfully there isn’t an image element that provides you an image swap when you hover it. This can be achieve with custom development only. You may also use two separate image element in a column and then with the use of a custom css, you can show/hide the images. I would love to give you an example if you can provide us your site details so that we can log in and create a test page.

Hope this helps. Please let us know how it goes.