How to make Prosites responsive

How can I make the prosites signup page responsive. The tables look really jumbled on the iphone view.

  • Vinod Dalvi
    • WP Unicorn

    Hi Jason,

    I hope you are well today and thank you for your question.

    To make the prosites signup page responsive, you can try adding the following CSS code in the style.css file of your child theme or add it in your site using the following plugin.

    https://wordpress.org/plugins/simple-custom-css/

    @media screen and (max-width: 960px) {
    #prosites-checkout-table .free-plan-link,
    #prosites-checkout-table ul.pricing-column{
    	width: 100% !important;
    	clear: both;
    	text-align: center;
    	margin: 0 !important;
    }
    }

    Please note i have used !important in the above CSS code to overwrite all other CSS property values, it's not recommended to always use the !important as it overwrites other property values but we have used it here because in this case we have to overwrite other property values.

    Best Regards,
    Vinod Dalvi

  • Vinod Dalvi
    • WP Unicorn

    Hi Jason,

    You can make the text "I would like to try it now free for 14 days and upgrade later." display better by making its position static as displayed in the following code.

    @media screen and (max-width: 960px) {
    #prosites-checkout-table .free-plan-link,
    #prosites-checkout-table ul.pricing-column{
    	width: 100% !important;
    	clear: both;
    	text-align: center;
    	margin: 0 !important;
        position: static !important;
    }
    }

    Cheers,
    Vinod Dalvi

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.