Skip to content
OverviewSolutions
8
Comments
2
David Sumner
@Sumner-David

All comments

  • David Sumner•195
    @Sumner-DavidPosted over 4 years ago

    Hey,

    For the email address button, try making it a simple button without any type='submit', then on the JS side of this, add an eventListener on click to check if your input field is valid (Probably with some RegEx magic) then if true use JS to submit the form that way. This way it does the check first. You'll need to add a name to your form though for JS to hook onto that.

    As for the Reload, that's because the form action is set to action="". This is the same as action="/" which means homepage. So form on submit is redirecting you to hompage which is index.html

    Hope that helped :D

    0
  • Akash CP•30
    @shakaccpSubmitted over 4 years ago

    I tried my best to complete the challenge but failed miserably, but i successed half.I need constructive feedback,Please help anyone if you know. Successed in making cards and heading,desktop version failed in alligning cards and mobile version. anyone please help me if you know.

    html,css,bootstrap

    2
    David Sumner•195
    @Sumner-DavidPosted over 4 years ago

    Hey Akash, well done for getting that far. You got most of the stying in but i think your issue was more of setting up the base layout of the project. Even i have problems with that bit. Probably the hardest part for me is layout and planning for responsiveness

    From my opinion, this project is best done using CSS grids on the card section since there are no defined rows or they intersect with each other.

    Looks like you used Bootstrap for the card layout. Bootstrap is good for base layouts but for more complex ones consider things like flexbox and CSS grids, or even doing some magic with margin values. Careful with using bootstrap for everything too. Some people fall into a crutch of using it over learning more css.

    I did this one yesterday. Try having a look at my code. It's a bit messy, but i managed to get what was needed with CSS grids.

    Once you learn grids and flexbox, layouts get wayyy easier :)

    https://www.frontendmentor.io/solutions/used-css-grids-for-desktop-and-tablet-then-flexbox-for-mobile-k2Vyj5wYf

    1