warning
id attribute value must be unique
<rect id="b" width="960" height="600" rx="20"></rect>Submitted
Huddle Landing Page With Fluid Typography and CSS Animations
P
ApplePieGiraffe• 30,105
@ApplePieGiraffe
Design comparison
Reports
Accessibility report (8)
warning
id attribute value must be unique
<filter x="-1.6%" y="-2.5%" width="103.1%" height="105%" filterUnits="objectBoundingBox" id="a">warning
id attribute value must be unique
<path d="M20 0h920c11.046 0 20 8.954 20 20v44H0V20C0 8.954 8.954 0 20 0z" id="d"></path>warning
id attribute value must be unique
<filter x="-1.6%" y="-23.4%" width="103.1%" height="146.9%" filterUnits="objectBoundingBox" id="c">warning
id attribute value must be unique
<linearGradient x1="14.811%" y1="-22.362%" x2="75.996%" y2="119.406%" id="e"><stop stop-color="#FAD961" offset="0%"></stop><stop stop-color="#FF52C1" offset="100%"></stop></linearGradient>warning
Heading levels should only increase by one
<h3 class="feature__body__heading mg-bottom-sm">Grow Together</h3>warning
All page content should be contained by landmarks
<div class="hero__body animate__animated animate__fadeInLeftBig">ApplePieGiraffe’s questions for the community
Hey, everybody! 😁
This was a fun project in which I tried my hand at implementing fluid typography (i.e., the size of the text grows larger and smaller with the viewport width) with the CSS function clamp() and included some cool animations from, of course—Animate.css.
It's not perfect—but I'm learning a lot and it's great fun! 😆
Feedback is welcome and much appreciated! 👍
Community feedback
karenefereyan• 375
@karenefereyan
Posted
Nothing in this world has confused me.more than clamp() 😫😫😫😫
1
P
ApplePieGiraffe• 30,105
@ApplePieGiraffe
Posted
@karenefereyan
😅😀👍
0
Srinishaa• 0
@Srinishaa
Posted
I loved it. I am learning to use animations too.
0
P
ApplePieGiraffe• 30,105
@ApplePieGiraffe
Posted
@Srinishaa
Thanks! Animations are a lot of fun.
0
Please log in to post a comment
Log in with GitHub
Join our Slack community
Join over 180,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!