Hello. I think I’m going to call challenge 2 done. I’ve worked off and on for 3 days and am very satisfied with most everything. I know that it could be so much more. That said, it’s only a challenge and I’d like to move on. I passed all 17 tests after an hour. The rest of the time was spent on responsiveness and then styling. I styled it after Amazon’s style due to the content but, I emulated it to get the practice. I didn’t copy any of their colors or c/p any of their code. Let me know what you think.
I know I can do more but, I also feel like I can revisit it later, once I’ve had more practice and learned more things.
If you need me to look over yours, let me know! Thanks!
Out of curiousity, you are using a grid layout, with the grid-template-columns set to 1fr 1fr 1fr… but then you use two columns. On this laptop, I see two columns used and a third one, empty.
Thanks for responding. Yes. There is an empty grid space, on purpose. I used a “.” to keep that center row, last column empty. It brings the form to just the center area, making it centrally located at all times. Also, if I ever go back to add some more text and some links or images, or even ad space, I have that available.
I just needed nothing there. I like it but, happy to hear your opinion. Do you dislike the design on a pc?
Hey, thanks for checking it out! Well, you were the first that had an issue with mobile so, I’m glad you looked. I had designed for mobile and had a media query set at 600. You squeaked through at 602. I bumped it up to 610 to accommodate.
That takes care of the invisible column(since it’s only supposed to be on desktop or large screens.(thanks)
That puts all labels where they should be on a 602px screen.(because it should have swapped, it did for me and everyone else. Thanks)
I’m no the biggest fan of the orange m either but, if you look at it on pc, I’ve got a shadow to draw it out. Still not showing up mobile. But, due to being based on Amazons limited pallette and my limited experience, I’m still working on that, at a later date.
Thanks for the suggestion on the radio buttons. I don’t have a problem with them personally. I think it was the display issue that I fixed.
Submit button should be fine if the media query had worked. It’s a tad small but, pretty standard size compared to Amazon Payments.
And, the left column should match the right column when not in mobile view. Don’t know what you’re seeing but, form is perfectly centered for me on both mobile and pc. Probably down to those 2 extra pixels on the mediaquery(which I’ve fixed. Thanks.)
Going back I did add an Amzon logo(not working my mobile) working on that. Just to show that it was based on Amazon and their minimal design. Like on https://pay.amazon.com/us/global-partner-program
But, I really thank you for being thorough.
I do try to, but sometimes my iphone shows the codepen’s full page weird…I noticed some other people on here, as well as one codepen, have had some compatability issues, but I guess @Jerami figured it out! I’m gunna look at this article though anyways, maybe it’ll help me fix my issues. Thank you