Global Border/Corner Radius Setting

Conrad Jamir

• May 19, 2020 05:37

The Image Module should have the same settings as Column More Setting.

The Column More Setting has a Corner setting to set the radius for all corners or individual corners.

2

• 

  Alex

  • May 19, 2020 13:28

  Hi,

  I will add this to our list of feature requests. As a solution, you can set the image as the background for the column and then play with the corners of the column :)

  0
• 

  Conrad Jamir

  • May 20, 2020 02:40
  • Edited

  Please add feature and fix. Seems like a lot of work to make a different border radius on one corner. See below:

  1. How would I set Column width and height so the background image is square without having to add css properties or css class? Where do I set Background Size (contain, cover, pixel, %), Background Alignment, Background Repeat, etc. I know the Image (Background or Element) has the option to change the origin and re-position image inside Column or Image element, but this seems very limited. 
     
     
  2. Using custom CSS on Image element in the More Setting, I had to add an { overflow: hidden } css property for the { border-bottom-right-radius: 30px; } property to work.
     
     ex: element { overflow: hidden; border-bottom-right-radius: 30px; }
     
     
  3. Using a CSS class to an Image element in More Setting (img-btm-right-radius), then adding properties in my css file, I had to add the .brz-image class to my custom class (img-btm-right-radius) in order for css properties to apply to image element.
     
     ex. .img-btm-right-radius .brz-image { border-bottom-right-radius: 30px; }

  I will add #1 to a separate feature request and #2, #3 as a possible bug? Please advise. Thanks

  0
• 

  Alex

  • May 20, 2020 13:18

  Hi,

  1. you can't do that now. Only custom CSS. In the future we will add more background options.

  2. I'm glad you found a solution.

  3. That's how it works. The custom class is structurally added to a higher position and brz-image is the class you need to work with.

  I will pass these things on to the developers and see what we can improve.

  0

Please sign in to leave a comment.