Skip to content
OverviewSolutions
2
Comments
2

Yasser Shehab

@Yasser-Shehab40 points

Front-End Developer

Latest solutions

  • Submitted 4 months ago

    Blog Card Preview

    • HTML
    • CSS
    1

    What could I improve in my code and which semantic element could've been more useful also if there were a better way to write my CSS.

  • Submitted 4 months ago

    QR Code Component

    • HTML
    • CSS
    1

Latest comments

  • SunnyFGC•130
    @njmoon21Submitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I'm the most proud of how well I was able to format and align all of the elements inside the container.

    What challenges did you encounter, and how did you overcome them?

    The only challenge I encountered was the "Learning" section of the page, which basically had a rounded rectangle around the text. I was trying to use a div, however it ended up taking up the entire row. Instead I used a span, since it's only for inline.

    What specific areas of your project would you like help with?

    I need help with learning how to import fonts and how to use the specific attributes that are listed in the Figma design files.

    Blog Preview Card using HTML and CSS!

    1
    P
    Yasser Shehab•40
    @Yasser-ShehabPosted 4 months ago

    Nice Job, you can try using BEM Methodology it will help you organize the CSS classes you write.

    Also you need to use semantic elements to make any website you create SEO friendly

    Like figure element to wrap the Images in.

    1
  • EasonVora•40
    @EasonVoraSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of learning how to use Media Query with no prior experience with using it. If I were to do it differently next time, I would learn how to use a grid design.

    What challenges did you encounter, and how did you overcome them?

    I was unfamiliar with flexbox and media query but figured out how to use them for this project. I hope to get more experience with using them.

    What specific areas of your project would you like help with?

    Flexbox, Grid, and Media Query.

    Flexbox and Media Query

    2
    P
    Yasser Shehab•40
    @Yasser-ShehabPosted 4 months ago

    Your solution works well, especially with media queries for responsive design! However, consider utilizing media queries for more complex aspects of the layout. For example:

    While the width of #code-title-text changes nicely across breakpoints, you might notice some abrupt transitions. Tools like clamp() or calc() for widths and font sizes can create a smoother experience.

    Marked as helpful
    1