Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Log in with GitHub
OverviewSolutions8Comments8

All comments

  • Nick Carlisi• 180

    @nickcarlisi

    Submitted

    This is my third challenge and I'm pretty happy with it. The first challenge was simple enough that I didn't really have to worry much about responsiveness. For the second challenge, I didn't use a mobile first approach and after getting the layout looking good on large screens, it fell apart on mobile size(s), and I had to start over again. This time around I used a mobile first approach and it was soooo much easier. Quite happy with the way this turned out, but of course, always open to suggestions for improvements, tips, etc. As for the javascript, I did have to look up how to verify an email address and found some crazy code that I can't imagine myself (or too many other people) coming up with. If there are better ways to do this, please let me know. Thanks!!

    Mobile first responsive page using HTML, CSS and vanilla JavaScript

    2

    Bulumko Papu• 180

    @bulumkopapu

    Posted

    Hey Nick

    Great work and dig your interpretation. I like what your JS logic its short and sweet.

    Its a pity that Front End Mentor leaves it up to us to decide how the design should look like In-between devices. I find it tricky myself to decide how elements should interact and shift.

    I would look into your code that dictates how things look for tablet (768px). If you look at the design file @768px (device width) you'll see that there a specific layout the designer has prescribed. Your layout could use just little bit more tweaking to look exactly like the design at that specific width.

    I love your mobile interpretation as well. All in all great stuff!

    Marked as helpful

    1
  • Hawawu Oladipo• 90

    @bolanleola

    Submitted

    Hello Everyone!

    I was able to complete the second challenge on HTML and CSS.

    Your reviews will be much appreciated.

    Gracias!!

    HTML, CSS

    3

    Bulumko Papu• 180

    @bulumkopapu

    Posted

    I love the responsiveness of your code.

    I would look into using the max width property on your cards to make them have the same dimensions as the cards on the design. Also I would add "border: none;" to your button class to make sure it looks like the one on your design.

    Great effort!

    0
  • Bulumko Papu• 180

    @bulumkopapu

    Posted

    Nice effort!

    Marked as helpful

    0
  • Bulumko Papu• 180

    @bulumkopapu

    Posted

    Nice effort

    Ive skimmed through your code an I see you are using min-width a lot. Try to incorporate the max-width property on some of your classes and elements so that they can truly responsive throughout.

    Have a great one

    Keep pushing

    0
  • Bulumko Papu• 180

    @bulumkopapu

    Posted

    Great design!

    Your header image does not fill the screen at 766px or so. Would look into trying to make it fill the width of the screen or viewport somehow. May making it fill 100% of the container its in?

    Overall great work!

    1
  • Bulumko Papu• 180

    @bulumkopapu

    Posted

    Great work!

    0
  • Bulumko Papu• 180

    @bulumkopapu

    Posted

    Great approach.

    0
  • Reinhardt Venter• 25

    @RingoFloyd

    Submitted

    This is my first challenge submitted. I am fairly happy with the desktop design, although there is a border on the right I would like to remove that I can't seem to get rid of.

    I have also not been able to make the design responsive for tablet and phone screens and I would appreciate any help anyone can give me.

    HTML & CSS

    1

    Bulumko Papu• 180

    @bulumkopapu

    Posted

    Hey REINHARDT great work. Getting a design to be responsive is much easier than it use to be.

    Check my code out here and see how I went about developing the meet landing page: https://github.com/bulumkopapu/meet/tree/master

    Checkout these resources below they should point you in the right direction:

    1. Flexbox: https://www.youtube.com/watch?v=fYq5PXgSsbE

    2. CSS Grid: https://www.youtube.com/watch?v=9zBsdzdE4sM&t=2s

    3. CSS Media queries: https://www.youtube.com/watch?v=yU7jJ3NbPdA

    0