Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
11
Comments
8

jack fikolson aka frontfliper

@areklaz145 points

best frontfliper in the world

I’m currently learning...

backfliping

Latest solutions

  • Four card feature section


    jack fikolson aka frontfliper•145
    Submitted about 3 years ago

    0 comments
  • Article preview component


    jack fikolson aka frontfliper•145
    Submitted about 3 years ago

    1 comment
  • Social proof section


    jack fikolson aka frontfliper•145
    Submitted about 3 years ago

    0 comments
  • 3 column preview card component


    jack fikolson aka frontfliper•145
    Submitted about 3 years ago

    0 comments
  • NFT preview component


    jack fikolson aka frontfliper•145
    Submitted about 3 years ago

    0 comments
  • Interactive rating component


    jack fikolson aka frontfliper•145
    Submitted about 3 years ago

    0 comments
View more solutions

Latest comments

  • Jason Lee•10
    @JLee2011
    Submitted about 3 years ago

    no flexbox, grid or positioning utilized.

    3
    jack fikolson aka frontfliper•145
    @areklaz
    Posted about 3 years ago

    Why do you want to center it without flex? It's the simplest way.

    The best practice is basically using responsive units like rem, em or %. But it doesn't mean you can't use px at all. Try to use rems as font-size and margin/padding just like you (almost) did here.

  • Dicky Dwi Darmawan•40
    @ddky16
    Submitted about 3 years ago

    3 Column Preview Card with Flexbox and Responsive Design

    1
    jack fikolson aka frontfliper•145
    @areklaz
    Posted about 3 years ago

    Hello. I really liked this challenge because of those buttons.

    You should really try on the buttons { mix-blend-mode: screen; } - read about it.

    You can check out my .css for this challenge to see how much less code i have there because of this simple trick :). You simply doesn't have to set it all manually while on hover.

    Marked as helpful
  • GARGithub•80
    @GARGithub
    Submitted about 3 years ago

    QR Code Component - Flexbox

    1
    jack fikolson aka frontfliper•145
    @areklaz
    Posted about 3 years ago

    Not really but you can delete flex and flex-direction from .card 100vw in .main width is not needed. Height: 100vh is enough .card img height: auto - not needed

    I don't know if there is something more to get rid of :D

  • Virag Kormoczy•70
    @virag-ky
    Submitted about 3 years ago

    3 Column Preview Card Component

    1
    jack fikolson aka frontfliper•145
    @areklaz
    Posted about 3 years ago

    Hi :). I can see a bit of a problem with your buttons on hover.

    The simplest solution will be setting the height and width of the button in px and getting rid of the padding if you really want to leave the font weight on hover.

    It can be also done with pseudo elements but since they have the same content inside it will be easier and faster the 1st way.

  • Mohamed Khaled•160
    @mohamedkhaled4053
    Submitted about 3 years ago

    QR code component solution

    2
    jack fikolson aka frontfliper•145
    @areklaz
    Posted about 3 years ago

    Cool, but a bit too wide :)

  • ApplePieGiraffe•30,525
    @ApplePieGiraffe
    Submitted over 4 years ago

    (Almost) Pixel-perfect Landing Page With Svelte, Sapper

    6
    jack fikolson aka frontfliper•145
    @areklaz
    Posted about 4 years ago

    Wow. I wish i could have such skills and become senior master extra developer like you.

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