Please Bring Equal Height!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Support Ginger Coolidge

    (@gscoolidge)

    1 week, 4 days ago

    Hello @mohsinworld ,

    Glad you reached out, happy to help!

    The Two Panel donation template option can be very different from form to form based on an image length of the left panel, and additional blocks used on the right panel. Given that, we decided to leave it up to the individual site owner in how that can be styled with additional CSS if needed instead of forcing a layout.

    I hope this helps to clarify things! Please let us know if you have further questions we can assist with 🙂

    Thread Starter Mohsin Alam

    (@mohsinworld)

    1 week, 4 days ago

    Please help me make it an equal height. Thanks

    Plugin Support Ginger Coolidge

    (@gscoolidge)

    1 week, 4 days ago

    Hellp @mohsinworld ,

    Happy to take a look, however, I’ll need at a minimum a link to your donation form please.

    Best regards,

    Thread Starter Mohsin Alam

    (@mohsinworld)

    1 week, 4 days ago

    This is the link: https://drkwasiafrifa.com/donation/

    Plugin Support Ginger Coolidge

    (@gscoolidge)

    1 week, 3 days ago

    If you increase the margin above and below the header of the right-panel surrounding “How much would you like to donate today?” , that will push it down to match the bottom of the left-panel.

    .givewp-donation-form__steps-header {
         margin-top: .8rem;
         margin-bottom:.85rem;
    }

    The link to the screenshot below shows the results of the above values. You can adjust the rem values to your liking and/or make other adjustments, but that should get you started.

    https://www.loom.com/i/75bc75fdec5d4aa9b59453ad0044f546

    Regarding where to put the CSS changes, since the donation forms are in an iFrame, you’ll need to place this in the Design – Styles – Custom Styles area as shown below. Save the changes and refresh to be able to see the results.

      I hope this helps to point you in the right direction! Have a great weekend 🙂

      Thread Starter Mohsin Alam

      (@mohsinworld)

      1 week, 3 days ago

      I have used this CSS:

      .givewp-donation-form__steps-header {
      min-height: 80px;
      }

      Awesome help. Thanks

    Viewing 6 replies - 1 through 6 (of 6 total)

    You must be logged in to reply to this topic.

    Tags