Formatting alert boxes

[KimAnn]

Hello-

Is there a way to get all 4 alert boxes on this page to be the same size?
https://devv.rayrolando.com/members-portal/

Thank you

[ruenel]

Hey Kim,

Thanks for writing in! We cannot check the URL because we need to log in first. Meanwhile, when inserting alert boxes, please set the width and maximum widths. If you have two or more alert boxes, make sure that they have the same width and maximum width settings.

To be familiar with the Alert box and its settings, kindly check out this documentation:

• https://theme.co/docs/alert

If you don’t see some of style options, you need to turn on the Advanced Mode by going to the Settings > Preferences > Advanced Mode

Best Regards.

[KimAnn]

That only takes care of the width, I need it to take care of the height as well and all be the same size boxes. It also became non responsive on mobile please have a look…

I took the restriciton off so you can see it:
https://devv.rayrolando.com/members-portal/

[nabeel]

Hey Kim,

You can remove the width and max-width to resolve the mobile responsive issue and go to the Row settings that contains your alert boxes and set the Align Vertical option to Stretch:

This will make your all boxes the same height.

Let us know how this goes!

[KimAnn]

Thank you for your response but that also did not work. See the different box sizes here after doing what you suggested:
https://devv.rayrolando.com/members-portal/

[nabeel]

Hey Kim ,

To better assist you with your issue, kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:

• Link to your site
• WordPress Admin username / password
  ​
  To know how to create a secure note, please check this out: https://theme.co/docs/getting-support

Thanks!

[KimAnn]

I updated a secure note w login, thank you

[nabeel]

Hey Kim,

Thank you for providing the credentials. I enabled the Flexbox Layout for all the Columns that contains the Alert element then I added the following code in the Element CSS of the Alert elements:

$el {
  height: 100%;
}

This seems to have made them equal in height, please clear your brower’s cache and check your page now. Cheers!

[KimAnn]

Awesome thank you so much!

[tristup]

Hi Kim,

Glad to help you.

Thanks