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

Angelo Barbarulo

@JorahhhSalerno, (SA)280 points

Hi There! I'm Angelo. I’m learning Frontend and Backend specifics. So say Hi! to a beginner!

I’m currently learning...

HTML, CSS and JavaScript.

Latest solutions

  • News | Homepage

    #accessibility#semantic-ui

    Angelo Barbarulo•280
    Submitted over 2 years ago

    0 comments
  • SunnySide Agency | Landing Page | FlexBox


    Angelo Barbarulo•280
    Submitted over 2 years ago

    0 comments
  • Intro component with sign-up form


    Angelo Barbarulo•280
    Submitted over 2 years ago

    1 comment
  • Interactive Component


    Angelo Barbarulo•280
    Submitted over 2 years ago

    0 comments
  • Article Preview Component


    Angelo Barbarulo•280
    Submitted about 3 years ago

    0 comments
  • FAQ Accordions Component


    Angelo Barbarulo•280
    Submitted about 3 years ago

    0 comments
View more solutions

Latest comments

  • Arthur Roberts•410
    @arfarobs
    Submitted over 3 years ago

    Art gallery Website | API | Leaflet.js | HTML | CSS | JS | Responsive

    #accessibility
    2
    Angelo Barbarulo•280
    @Jorahhh
    Posted over 3 years ago

    It looks nice Arthur. I was waiting for this!

    • I did as you did using two .css file but I'm not sure that it is correct.
    • The <form> selector is useful when you have to send data to the server (for example the registration module).
    • You could have used also the <br> to break the headings and match the design

    Just onother thing. if I were you I would have put the images with @2.jpg, they have a better resolution. With the images that you put the project loses a lot. Try with it.

    Marked as helpful
  • Vanza Setia•27,715
    @vanzasetia
    Submitted over 3 years ago

    Equalizer Landing Page | HTML CSS Sass

    #accessibility#bem#sass/scss#lighthouse
    3
    Angelo Barbarulo•280
    @Jorahhh
    Posted over 3 years ago

    Wow Vanza, it seems as perfect as the original! Love the responsiveness here.

    By the way, some days ago I did this challenge too, and I have few "issues" to which I have not yet received an answer.

    Hope you can take a look: My challenge

    For a beginner like me would be great to have some feedback from someone more experienced.

  • Tosin Daramola•680
    @Heph-zibah
    Submitted over 3 years ago

    Responsive social proof section using HTML, CSS FELXBOX, and CSS GRID

    #accessibility
    2
    Angelo Barbarulo•280
    @Jorahhh
    Posted over 3 years ago

    Hey Abigail, to put two images in the backgroud, try with this:

    Background-image: url(“top bg), url(“bottom bg”); Background- repeat: no repeat, no repeat; Background-position: left top, right bottom; Background-size: contain;

    I did like this in my project, so I think it works 👌🏽

    …and oh, good job!

    Marked as helpful
  • Ibtissam•240
    @Devibtissam
    Submitted over 3 years ago

    single price grid using css grid

    #accessibility
    2
    Angelo Barbarulo•280
    @Jorahhh
    Posted over 3 years ago

    I think you forgot to put the border radius at the whole grid.

    Just put in the main container:

    ‘Border-radius: 10px;’ (or less)

    And also in the mobile version in the first and last square.

    This time you have to do in the first square:

    Border-top-right-radius: 10px Birder-top-left-radius: 10px

    …and in the last one:

    Border-bottom-right-radius:10px; Border-bottom-left-radius: 10px;

    For the rest, it seems fine. Nice job! 😀

    Marked as helpful
  • Carol•30
    @carolandrade1
    Submitted over 3 years ago

    Responsive Social Proof Challenge with Next.js and Tailwind

    #accessibility#next#react#tailwind-css
    2
    Angelo Barbarulo•280
    @Jorahhh
    Posted over 3 years ago

    Wow! The responsiveness here is perfect! Love how it works. Good job!

    For the Background, try with:

    • background-image: url("top"), url("bottom")
    • 'background-repeat: no repeat, no repeat;'
    • 'background-position: left top, right bottom;'
    • 'background-size: contain;'

    I'm not sure it's correct but on my challenge it looks good (I'm still doing it). Hope it helps

    Marked as helpful
  • Angelo Barbarulo•280
    @Jorahhh
    Submitted over 3 years ago

    Single grid component

    2
    Angelo Barbarulo•280
    @Jorahhh
    Posted over 3 years ago

    Ah! I think I did some mistakes in the @media queries with screen side dimensions.

    I put wrong min-max widths, 'cause from my pc (MacBook Air so its 1280px x 800px, I guess) it seems fine, but from others pc's not.

    Basically, on a bigger screen I see what I should see on a mobile device.

    Any suggestion on this?

View more comments

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