Suvey Form alignment on mobile

Hi all,

I’ve just completed the Survey Form project, simple though it is, and I’m having some issues with my CSS. Specifically, my survey questions are supposed to be right aligned, but justify-content doesn’t seem to work on them in certain mobile browsers, like Chrome, thought it does in Firefox. Desktop browsers seem to work fine. Any help would be appreciated.

https://cinephile85.github.io/freecodecamp/01-responsive-web-design/02-survey-form/

Thanks!

Well you’d have to be specific about “certain” browser & OS version numbers. iOS 10 Safari is aligned properly, but zoomed out because you didn’t set the initial device pixel. iOS Chrome is Safari with different window dressing. You could try using chrome developer tools on your phone after connecting it to your computer with a USB cable. But first you should markup the page for mobile and maybe write a media query.

Use <label for=" "> on every input.

Well, this is much more involved than I anticipated. I appreciate the feedback, but I guess for now I’m going to just push on with my learning and come back later when more of this has sunk in.

Thank you for when I get enough experience to be able to utilize this!

Well, at least fix the HTML. That was covered in the challenges. And maybe limit the number input to a realistic user range. And the meta viewport statement in the head.

My authority sources would only give me mobile implementation stats for justify-content:center; so I couldn’t guess about mobile hence my suggestion.

Don’t get overwhelmed just stick closer to the curriculum for now.

Meta tag viewport info

It’s not perfect, but definitely improved!