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

Submitted

Fylo Landing Page Two Column Layout - Vanilla CSS and HTML

Lisa Allen 520

@CrypticMango

Desktop design screenshot for the Fylo landing page with two column layout coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


The fine details of this one threw me for a loop...

  1. I do not know how to get the error message to display underneath the text box.
  2. I could not get the social buttons at the bottom of the page to work correctly in the hover state. the icon and the outline change colors separately.
  3. Yes I know my CSS is very long and could use some cleaning up but I was struggling 😅
  4. Don't be afraid to pick my solution apart so I can improve! Thanks :D

Community feedback

@Esesosa-max

Posted

  1. Good Looking Design (desktop 3/3,mobile 2/3) 5/6
  2. HTML is somewhat structured 2.5/5
  3. deadly responsive (impressive !!) 5/5
  4. Good Application of CSS Variables and mobile first (impressive !!) 5/5
  5. Fixes and personal suggestions
    • i do not think you should put everything into the main
    • instead of using <header> use <nav> or just put the nav inside the header
    • <header><nav></nav></header>
    • your header is a bit mess up
  • input is not properly styled
  1. Great Job : 18/21

Marked as helpful

1

Lisa Allen 520

@CrypticMango

Posted

@Esesosa-max Thanks for the feedback! So I have a question... about not having everything inside of the main, it's okay to just have some elements hanging around on their own without being inside of the main? or do I have to use a different element for the rest? Not sure why but I was under the impression that I had to put everything in the main

Also, what did I do wrong with my input?

Thanks for the tips and compliments I appreciate this a lot. I have to go back and sift through some things.

0

@Esesosa-max

Posted

@CrypticMango very sorry for the late reply, my computer has been very terrible lately so I could not log in to my frontendmentor. The alignment of the text inside of the input; that's not styled properly. The problem with the main, this is my personal opinion but I think you should put most of the elements inside the main and the remaining elements put them inside a section and footer.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord