Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
5
Comments
10

Freedteck

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

  • Stats preview card component using HTML and CSS


    Freedteck•130
    Submitted almost 2 years ago

    2 comments
  • order-summary-component with Html, css and bootstrap


    Freedteck•130
    Submitted almost 2 years ago

    0 comments
  • 3 column preview card component with HTML, CSS, and Bootstrap


    Freedteck•130
    Submitted almost 2 years ago

    0 comments
  • Responsive single-price-grid-component using HTML, CSS and Bootstrap


    Freedteck•130
    Submitted almost 2 years ago

    0 comments
  • QR code component using HTML and CSS Flexbox


    Freedteck•130
    Submitted almost 2 years ago

    1 comment

Latest comments

  • LucasDeveloper0•10
    @LucasDeveloper0
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    The responsive organization with css was the most difficult part of the project, but is a weasome tool to inclusive site for diferents dispositives

    Responsive inicial page

    1
    Freedteck•130
    @Freedteck
    Posted over 1 year ago

    Hello, well-done with your development journey. It seems you submitted a screenshot of the links instead. Because that's what I can see

  • Alper•1,090
    @adonmez04
    Submitted over 1 year ago

    FEM-testimonials-grid-section-v1

    1
    Freedteck•130
    @Freedteck
    Posted over 1 year ago

    Hi Alper. Great work here and well-done. I'd love to know more about the book you recommend. Did you have any link for it? Kindly share

  • Rawi2115•70
    @Rawi2115
    Submitted almost 2 years ago

    Order summary card

    1
    Freedteck•130
    @Freedteck
    Posted almost 2 years ago

    Hi, this is really cool. As for the background SVG, the step is pretty straight forward.

    1. In the css body selector, apply the background-image property with url as it's value i.e background-image: url(' link to the svg '); Note that the link to the svg is a relative one (./images/pattern-background-desktop.svg);
    2. U should use the background-repeat: repeatx; if you want.
    Marked as helpful
  • Alfrey-Chan•20
    @Alfrey-Chan
    Submitted almost 2 years ago

    QR-Code Card Using Flexbox

    1
    Freedteck•130
    @Freedteck
    Posted almost 2 years ago

    Hello, I can't find fault in ur html code, where you probably need changes is in your css code. Below are the suggestions I have:

    1. Since u used the flexbox property on ur body tag, use the flex-direction: column;. This will make ur card at the center of the page.
    2. For the font weight, it's best to apply corresponding weight to individual element such as h1 {font-weight: 700;} and p {font-weight: 400;}
    3. The flexbox has a gap property which you can apply to the card-contents to give space btw the components inside. Such as gap: 20px;
    Marked as helpful
  • olaoluwa•20
    @ollie-cyber
    Submitted almost 2 years ago

    QR CODE DESIGN USING HTML AND CSS FLEXBOX

    1
    Freedteck•130
    @Freedteck
    Posted almost 2 years ago

    Hi, well-done with the exercise. It's very clean and clear. Concerning the question, you can use max-width: 100% instead of width property on the img tag. This will make the image responsive and fit in the div as you want.

    Again, well-done writing clean codes

    Marked as helpful
  • MeaganA•40
    @MeaganA
    Submitted almost 2 years ago

    QR Code Card Component using HTML/CSS

    2
    Freedteck•130
    @Freedteck
    Posted almost 2 years ago

    Hi, well-done here. Your code is very clear and clean. From what I observed, you work a lot with margin which can create more space. Try any or all following if it'll help:

    1. Adjust the size of the margin you gave the cards,
    2. Since u used flexbox, work with the gap properties instead of using margin and apply side padding.
    3. Another thing u can try is to apply the flex layout to the body itself and try to set its min height to 100vh, justify content center, align items center.

    While some of these might not work for you, it's still good to try them out

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