@MNSM92
Posted
div { height: 100px; /* Set the desired fixed height / overflow: hidden; / Hide any overflowing content */ }
OR,
div { max-height: 200px; /* Set the maximum allowed height / overflow: auto; / Add scrollbars if needed */ }
One of the challenges I encountered in my code was preventing text from increasing the height of a div
. When the text inside the div
dynamically changes or becomes longer, it causes the div
to expand vertically, which was problematic for maintaining the desired layout.
How do I fix such problem?
@MNSM92
Posted
div { height: 100px; /* Set the desired fixed height / overflow: hidden; / Hide any overflowing content */ }
OR,
div { max-height: 200px; /* Set the maximum allowed height / overflow: auto; / Add scrollbars if needed */ }
@0xabdulkhaliq
Posted
Hello there 👋. Congratulations on successfully completing the challenge! 🎉
HEADINGS ⚠️:
<h1>
so it can cause severe accessibility errors due to lack of level-one headings <h1>
h1
element identifying and describing the main content of the page.h1
heading provides an important navigation point for users of assistive technologies, allowing them to easily find the main content of the page.sr-only
class to hide it from visual users (it will be useful for visually impaired users)<h1 class="sr-only">3-column preview card component</h1>
my submission
for this challenge and feel free to reach out to me..
I hope you find this helpful 😄 Above all, the solution you submitted is great !
Happy coding!
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord