Registration Form help - General Discussions

RE: Registration Form help

Robert — Fri, 21 Sep 2018 08:11:48 +0000

You'll not see the difference in mobile. Mobile browser cache is very hard. You should use other phones or browsers which have never opened your website. And please leave some URL to your website.

RE: Registration Form help

A_Goer — Thu, 20 Sep 2018 15:23:27 +0000

I moved the code as requested. Thw button is still cut down in mobile view. Any suggestions? Thank you for helping me with this.

RE: Registration Form help

Robert — Mon, 17 Sep 2018 08:43:19 +0000

@a_goer,

Please stop searching of overwriting issues, that CSS is located in core and that is the original CSS. The overwriting CSS are the custom CSS you're adding to fix conflicts.

Please add all new CSS code below others not on top others.

https://wpforo.com/wp-content/uploads/2018/09/2018-09-17_1241.png

RE: Registration Form help

A_Goer — Sun, 16 Sep 2018 06:02:04 +0000

I rechecked it, it was there all along. I placed it at the top and verified that there are no typos. How can I find out what is overwriting the "!important" statement? I cleared all cache afterwards and it is still not showing in Chrome Dev tools.

WPForo_CSS.png

RE: Registration Form help

Sofy — Sat, 15 Sep 2018 06:17:18 +0000

Hi A_Goer,

For mobile use the following one :

@media screen and (max-width: 800px)
#wpforo #wpforo-wrap .wpforo-register-wrap .wpf-field.wpf-field-type-submit input {
   width: 100% !important;
}

It seems you've forgotten writing the "!important" statement in the following CSS code.

RE: Registration Form help

A_Goer — Fri, 14 Sep 2018 16:38:12 +0000

Thank you. The mobile scale is cutting the button down.

Screenshot_20180914-123031.png

RE: Registration Form help

Sofy — Tue, 11 Sep 2018 13:31:16 +0000

Hi A_Goer,

To center the "After registration you will receive an email confirmation with a link to set a new password" element use the following code.

#wpforo #wpforo-wrap .wpfw-1{
    text-align: center;
}

To resize the registration button, use the following code for desktop:

#wpforo #wpforo-wrap .wpforo-register-wrap .wpf-field.wpf-field-type-submit input{
    width: 20%;
}

For mobile use the following one :

@media screen and (max-width: 800px)
#wpforo #wpforo-wrap .wpforo-register-wrap .wpf-field.wpf-field-type-submit input {
   width: 100% !important;
}

Registration Form help

A_Goer — Tue, 11 Sep 2018 11:25:25 +0000

I am trying to resize the register button and center it and text "After registration you will receive an email confirmation with a link to set a new password" to the page directly under the other fields. I set the button to 20% in custom css but it did not scale well on mobile screens so I removed the code. I can recreate the text and FA icon using the custom fields and center it if it is easier to just make the original one display:none.

RegistrationPage.png

RegistrationSettings.png