Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
11
Comments
8
jack fikolson aka frontfliper
@areklaz

All 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.

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

    I dunno what im doing lul

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

    u suck

  • Doniyor•20
    @Doniyor-Programmer
    Submitted about 4 years ago

    This is awesome!

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

    Almost

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