Skip to content
Submitted over 2 years ago

Responsive Web Page with help of Grid Layout + BEM + Flexbox

Vikram Ingleshwar•280
@vikramvi
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Clipboard landing page
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

  1. What did you find difficult while building the project ? 1.1 Lots of components and sub-components to keep track of 1.2 Consistent spacing between elements 1.3 SEO & Accessibility good practices 1.4 Images resizing

  2. Which areas of your code are you unsure of ? 2.1 Usage of max-width & width instead of margin or padding values which was causing overflow bug

  3. Do you have any questions about best practices ? 3.1 Is SEO tags used correctly ? 3.2 Is Grid layout & flexbox techniques used accurately ? 3.3 Any other areas of improvements ? 3.4 Is image sizing done properly ?

Community feedback

  • Yous•170
    @yousra10Posted over 2 years ago

    Hi Vicky, I just read your solution !! You are an expert !!! Thank you for sharing! I realise the same challenge and I would like what do you thing and your suggestions please.

    Thank you very much !! Happy coding Yous Ben

    0
    Vikram Ingleshwar•280
    @vikramviPosted over 2 years ago

    @yousra10 Thanks for your kinds words, please note that I'm NOT an expert yet LOL

    I'm learnings and kindly look at others solution as well; do your own implementation. Writing software is like making omelette, where everyone thinks his/her's the best LOL

    Please ping me on slack ( name: Vikram ), we've a study group ( accountability partners ), you can join us as well.

    My plan is to build all the projects from HTML + CSS and later JS, while doing that keep learning and improving.

    0
    Yous•170
    @yousra10Posted over 2 years ago

    @vikramvi Thank you very much Vickram!! I add you on slack!!

    0

Please log in to post a comment

Log in with GitHub

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