Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
18
Comments
6

Florin.Porut

@zastar23380 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

  • Responsive rest countries app with vue, axios and tailwing


    Florin.Porut•380
    Submitted almost 3 years ago

    0 comments
  • Responsive Rock-Paper-Scissors game with extra game mode (SCSS, JS)


    Florin.Porut•380
    Submitted almost 3 years ago

    0 comments
  • Full responsive multipage layout with SASS and JS


    Florin.Porut•380
    Submitted almost 3 years ago

    0 comments
  • Full responsive landing page with SCSS and JS (custom slider)


    Florin.Porut•380
    Submitted almost 3 years ago

    0 comments
  • Full responsive landing page with flex and js


    Florin.Porut•380
    Submitted about 3 years ago

    0 comments
  • Respunsive agency landing page


    Florin.Porut•380
    Submitted over 3 years ago

    2 comments
View more solutions

Latest comments

  • OkeraM•280
    @OkeraM
    Submitted almost 3 years ago

    Fylo landing page master

    #accessibility#angular#cube-css#materialize-css#jquery
    2
    Florin.Porut•380
    @zastar23
    Posted almost 3 years ago

    Use header, main, footer, don't use div's for landmark components, the images in the footer have a bad path to the img source, try and start working on mobile first design, it is easier because you don't have to worry so much about layout stuff(untill you get to bigger screens). Learn about rem, em, vh, vw, vmax and vmin, don't use fixed units (px).

  • Leah Thompson•30
    @leahthompson01
    Submitted over 3 years ago

    Responsive landing page using CSS Grid and flex-box

    #accessibility
    3
    Florin.Porut•380
    @zastar23
    Posted over 3 years ago

    Hello, to get rid of the space between the name and the verify graduate, just change the line-height in the div containing them and you should be good to go.

    Overall nice job done!

  • Francis•260
    @FrancisKhaledKhodja
    Submitted over 3 years ago

    Social Proof section with Flex and grid

    1
    Florin.Porut•380
    @zastar23
    Posted over 3 years ago

    Hi @FrancisKhaledKhodja,

    The end result looks nice, but you should try to code mobile first responsive, for me it is much easier, because if you remember, every html document is already responsive at any screen size before adding any css styles.

    With that in mind you can code mobile first without having to worry about layout stuff in the beginning, as for the problem that you had and wrote two style sheets, I think the solution to that is to learn about media queries and breakpoints.

    Hope this helps, Happy coding!

    Marked as helpful
  • Pranay Chavhan•20
    @PranayChavhan
    Submitted over 3 years ago

    Responsive Order Summary Component using flexbox

    #tailwind-css
    1
    Florin.Porut•380
    @zastar23
    Posted over 3 years ago

    You can do mobile first, it solves all your problems, any html you create is already responsive if you don't set fixed widths and heights on you're content.

    Learn about em, rem, vh, vw, etc and use them instead of fixed widths like px.

    Just play around with the responsive mode in your dev tools and you can figure it out.

    Happy coding!

  • Abdallah Hassan•20
    @Abdallahhassan186
    Submitted over 3 years ago

    3-column preview card

    5
    Florin.Porut•380
    @zastar23
    Posted over 3 years ago

    To get the mobile design, add a media query at 600px (in your case) and change de flex-direction of the container to column, add a width to the container of 80% perhaps, and a max-width of around 20 rem or so to not let the cards stretch so much that it becomes hard to read the text because of the long text lines, and maybe you need to add a bit o padding too to the cards.

    Hope this helps, happy coding!

    Marked as helpful
  • Gaurav Singh•440
    @Gaurav4604
    Submitted over 3 years ago

    Responsive stats page written in react js and material UI

    #react#material-ui
    1
    Florin.Porut•380
    @zastar23
    Posted over 3 years ago

    Hi, you should always consider doing mobile first, and desktop after, for me it is more easy to do it this way.

    I leave you a link about your problem, around the middle of the clip you can find an explanation on typography https://www.youtube.com/watch?v=VsNAuGkCpQU&t=183s.

    Hope this helps ! Happy coding!

    Marked as helpful
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