Latest solutions
FAQ Accordion - Gulp, SASS/SCSS, Accessibility
#accessibility#animation#sass/scss#gulpSubmitted over 1 year agoJS, JSON, Sass/Scss, Mobile-first, RWD - Result Summary Component
#sass/scss#accessibilitySubmitted over 1 year ago
Latest comments
- P@joekotvas@Szeri323
Hi @joekotvas,
Congratulations!
I like your solution and the challenge that you made for yourself. Keep it going!
- @VanshikaSabharwal@Szeri323
Hi @VanshikaSabharwal,
Good job, I like your solution!
If you are wondering what you can improve in your solution:
you could add padding on paragraps, it will look much better.
The second thing is to center the card in the middle of the page adding
min-height:100vh
on the body and use for exampledisplay:flex
and center it withjustify-content: center
andalign-items : center
or usedisplay:grid
and center it withplace-items:center
.I hope that it will will help.
Happy New Year! 🥳
- @mohit-sonii@Szeri323
Hi @mohit-sonii,
Nice work! I thought that I would offer you some advice.
If you want to center your card, use display: flex along with justify-content: center and align-items: center on the body tag, and make sure it's at least 100vh. For example, set min-height: 100vh.
You can use a CSS selector with the hover pseudo-class like this: h2:hover. It makes the heading change color when you hover over it:
h2 { font-weight: 700; } h2:hover { color: [your-color-here]; }
And some advice for optimization: You don't need to import all weights of fonts; you can choose the 2 that you use most.
I hope this helps you.
- @Justine-5@Szeri323
Hi @Justine-5,
Nice solution and good job!
In response to your question, it's considered good practice to specify which properties you want to include in the transition. By default, the transition affects all properties.
You can use something like this:
transition: 150ms ease-in-out opacity;
I hope this has been helpful.
Happy New Year!
Marked as helpful