Colorlib Wizard 14 not mobile responsive

[Real]

Hi there!

I’m a backend developer working on a project, and I really liked the design of the Colorlib Wizard 14 template, so I decided to use it. Please know that I have very small to no experience with CSS.

The template is great, but the radio button section (“Account” part) is sadly not mobile responsive and the buttons end up being outside of the screen. I tried my best to fix this but since I have no experience with CSS I couldn’t be able to fix it.

I don’t know if I can get any help from here, but I would appreciate it if someone could help me make the “Account” part mobile-friendly.

Thanks so much in advance,
Real.

[colorlibsupport]

Hi Real

Please provide a screenshot of the issue and a direct link to the page, probably I can help with custom css

[Real]

Hey!

Thanks for getting back to me quickly!

This is the webpage Sign Up Form (Enter a first name, last name, and an email, then click next to go to the “Account” tab where the issue happens)

And please find attached the screenshots of how it looks on mobile.

Again, thanks so much for willing to help me!
Real.

[Real]

And here’s another screenshot of how it looks zoomed out. Thanks once more.

[colorlibsupport]

Hi

Got it, thanks, this css can help:

@media screen and (max-width: 768px){
flex-direction: column;
}

[Real]

Hi

Thank you once again for the reply. I added the custom CSS to my website, and while it did fix my website, I was wondering if there’s a way I have a space between the radio buttons so the text doesn’t end up going over the next button and making it look cluttered as shown on the image.

Thank you once more!
Real

[colorlibsupport]

Hi

yes, you can use that code too:

@media screen and (max-width: 768px){
.form-radio {
    margin-top: 10px;
}
.label-radio {
    padding-bottom: 10px;
}
fieldset.current {
padding-top: 0px;
}
}

Regards

[Real]

Hi!

Thank you so much for your help! You have no idea how much this means to me as I’ve been trying to fix it for weeks now! Your code worked perfectly!

Once again, thank you!!!

Have a nice day / night!
-Real

[colorlibsupport]

Well, thank you to kind words

Have a nice week