Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
7
Comments
7
P

Dallas

@DasaruCalifornia, United States160 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

  • Testimonials Grid Section

    #bem

    P
    Dallas•160
    Submitted 4 months ago

    I would like help with my CSS tablet and desktop styles. I used nth-child and grid area labels to align things properly and I feel like it could have been written cleaner.


    1 comment
  • Four Card Feature Section

    #bem

    P
    Dallas•160
    Submitted 5 months ago

    I would like to know of alternate ways of aligning the cards for the desktop page.


    1 comment
  • Product Preview Card Component

    #bem#accessibility

    P
    Dallas•160
    Submitted 6 months ago

    There are multiple areas I would like help with:

    • BEM (block-element-modifier)
    • Accessibility
    • CSS organization

    1 comment
  • Recipe Page

    #bem

    P
    Dallas•160
    Submitted 7 months ago

    I would be grateful for any advice or tips on how to organize my CSS using BEM and what I could do differently.


    1 comment
  • Social Links Profile


    P
    Dallas•160
    Submitted 7 months ago

    I would like help with the organization of my CSS file. Any ideas on how I could rewrite it to make it easier to understand to other devs is greatly appreciated!


    1 comment
  • Blog Preview Card


    P
    Dallas•160
    Submitted 7 months ago

    Any tips on organizing my CSS file is greatly appreciated! I'm always second guessing myself on whether my CSS is readable enough.


    1 comment
View more solutions

Latest comments

  • P
    RF13•640
    @rf1303
    Submitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    It's the first time I use grid, I was studying to add to my knowledge, and it was difficult at first, it's more work at the beginning, but I liked using it

    Quiza necesite hacerlo mas rapido.

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

    The first time I use Grid, and I started studying some videos of Wes Bos that I got from the Front Mentor page, and other videos that I saw on YouTube

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

    I took feedback from the previous challenge and would like to know if it improved the code or if I misunderstood

    Grid Flexbox html css responsibilityapp

    #sass/scss#bem
    1
    P
    Dallas•160
    @Dasaru
    Posted 4 months ago

    For your HTML, you don't need to have a section wrapping your main tag. Instead of putting the layout class on section, you can use the body to align the inner content.

    Otherwise, your solution seems pretty good. Also, I'm not sure if you can have two font-faces with a font-family of barlow. I think each font-family needs to be different and in quotes as they are user-defined names.

    Marked as helpful
  • P
    Matthew•140
    @himattheww
    Submitted 5 months ago

    Four card feature section

    #pure-css#bem
    2
    P
    Dallas•160
    @Dasaru
    Posted 5 months ago

    I like your CSS Grid solution to the desktop page. That's a good way to align the cards.

    One small problem I found is that you put the header inside of the main tag. Both header and footer tags should be outside of main. Other than that, you did a great job.

    Marked as helpful
  • SHAKIR•90
    @shakirbakare
    Submitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of the fact that I used Sass @mixin, @media query and @content directives to make the solution responsive

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

    None

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

    None

    Responsive product preview card using Sass, @content, @mixin, and more

    #accessibility#bem#pure-css#sass/scss
    1
    P
    Dallas•160
    @Dasaru
    Posted 6 months ago

    Excellent solution. Nice use of mixins. I have not used Sass but I can see how useful it is to have your responsive styles next to the element in question.

  • SHAKIR•90
    @shakirbakare
    Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    I'm most proud of the number of problems I solved in this challenge:

    • I coded a border for all the table cells but the last one

    • I aligned the cells to match the design provided

    • I coded spacings for the table cells.

    • I styled the lists. Especially the bulleted lists. I controlled their size and color.

    And I did all these using the :not(:last-child) and :mark selectors, and the Sass nesting and mixin functionalities.

    I'm so proud of myself and skills!

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

    No challenges. I know my onions about styling in CSS

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

    None. But any feedback on my code structure, organization, and semantic elements choices would be appreciated

    Recipe Page using semantic elements, custom CSS properties, Sass, BEM

    #accessibility#bem#sass/scss#pure-css
    1
    P
    Dallas•160
    @Dasaru
    Posted 7 months ago

    Nice solution. One thing I would suggest using is CSS At-Rules such as @font-face and @media. Font-face is an alternative way to link fonts directly into your project as opposed to linking via CDN. Media queries are also a great way of making your page responsive for different sized devices such as mobile, tablet, and desktop.

    It's also worth noting to be careful of overusing the :not pseudo-class as it can increase the specificity of the CSS rule.

  • davilucas•80
    @Davilucca22
    Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    Do que você mais se orgulha?: consegui fazer o exercício de forma mais rápida, adaptei a imagem de acordo com o site

    o que faria diferente da próxima vez?: incluiria javaScript

    pagina com meus links sociais

    1
    P
    Dallas•160
    @Dasaru
    Posted 7 months ago

    Nice solution. I like how you customized this by adding in your own personal information. It's a nice touch. Here are some pointers for you:

    • I would recommend learning flexbox. That will allow you to align and center elements inside of containers.

    • For your HTML, you should use an unsorted list and have each anchor be inside a list element. Section tags should be used for larger parts of a webpage:

    <ul>
      <li><a href="#">Link 1</a></li>
      <li><a href="#">Link 2</a></li>
      <li><a href="#">Link 3</a></li>
    </ul>
    
    Marked as helpful
  • msharjeelali•60
    @msharjeelali
    Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    This time I managed to complete challenge quickly than before.

    Responsive Blog Card Menu Designed in HTML and CSS.

    1
    P
    Dallas•160
    @Dasaru
    Posted 7 months ago

    Great solution.

    I would recommend using flexbox to center the card on the screen rather than using the transform/translate method. You can make the body tag a flex object and center the card with justify-content and align-items.

    You can also use the flexbox gap property to align items inside of the card itself rather than using padding/margin on each item. It can help simplify the spacing logic to avoid future confusion.

View more comments
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub