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

Zayat

@Z-ayat310 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

  • QR code component solution


    Zayat•310
    Submitted about 3 years ago

    0 comments
  • NFT preview card component solution Pure CSS


    Zayat•310
    Submitted about 3 years ago

    0 comments
  • Huddle landing page Bootstrap


    Zayat•310
    Submitted almost 4 years ago

    1 comment
  • Bootstrap 5 Huddle-Landing-with curved Footer


    Zayat•310
    Submitted almost 4 years ago

    0 comments
  • Pure Css Landing Page


    Zayat•310
    Submitted almost 4 years ago

    0 comments
  • Pure Css Landing page


    Zayat•310
    Submitted almost 4 years ago

    0 comments
View more solutions

Latest comments

  • Miriama•10
    @miri52
    Submitted almost 4 years ago

    Card component using CSS variables and flexbox

    2
    Zayat•310
    @Z-ayat
    Posted almost 4 years ago

    You can use these examples https://clipboard-landing-site.vercel.app/ otherwise create a box-shadow:1px 1px 1px 1px #eee; and edit it with chrome dev tools till u get the desired shadow

  • Ahmed Saidi•130
    @AhmedSaidi99
    Submitted almost 4 years ago

    Testimonials grid section Html CSS Responsive Design

    3
    Zayat•310
    @Z-ayat
    Posted almost 4 years ago

    Nice work keep it up

    Marked as helpful
  • Yousef Khalid•580
    @YousefKhalid-iq
    Submitted almost 4 years ago

    Solution for project-tracking-intro-component with css/html/js

    2
    Zayat•310
    @Z-ayat
    Posted almost 4 years ago

    Can’t find out the web view from mobile but great work ❤️ Keep it going

  • Darshan Pandya•420
    @Darshan-Pandya10
    Submitted almost 4 years ago

    Responsive Design Using Flexbox and CSS media queries.

    2
    Zayat•310
    @Z-ayat
    Posted almost 4 years ago

    Quick search (benifits) section should be text-align-center; and in web view you can give the img position:relative;and left:-xxpx; till you get it as the design otherwise you did well ❤️

    Marked as helpful
  • Christopher Keller•20
    @ckeller22
    Submitted almost 4 years ago

    Blogr Landing Page with React/TailwindCSS

    2
    Zayat•310
    @Z-ayat
    Posted almost 4 years ago

    Don’t know how the image design looks but in the mobile-view nav links is to close from each other they need some margins

  • Mahmoud•160
    @Mahmoud-Abu-Zubaidah
    Submitted almost 4 years ago

    Starting with desktop finishing with FULL RESPONSIVE. Basic CSS & HTML

    2
    Zayat•310
    @Z-ayat
    Posted almost 4 years ago

    flex and padding would give you much more eye rest Check that solution "https://www.frontendmentor.io/solutions/pure-css-only-shadows-of-bs-and-fa-icos-P4yAaJnEA" created a div.container for the messages and gave it display:flex; flex-direction:column; then i used align-self on recived class to left and align-self:right; on sent which was {<p class="sent">Sent message...</p>}

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