This community-built FAQ covers the “Height: Minimum & Maximum” exercise from the lesson “Sizing Elements”.
Paths and Courses
This exercise can be found in the following Codecademy content:
Web Development
Learn Responsive Design
FAQs on the exercise Height: Minimum & Maximum
There are currently no frequently asked questions associated with this exercise – that’s where you come in! You can contribute to this section by offering your own questions, answers, or clarifications on this exercise. Ask or answer a question by clicking reply (
) below.
If you’ve had an “aha” moment about the concepts, formatting, syntax, or anything else with this exercise, consider sharing those insights! Teaching others and answering their questions is one of the best ways to learn and stay sharp.
Join the Discussion. Help a fellow learner on their journey.
Ask or answer a question about this exercise by clicking reply () below!
Agree with a comment or answer? Like (
) to up-vote the contribution!
Need broader help or resources? Head here.
Looking for motivation to keep learning? Join our wider discussions.
Learn more about how to use this guide.
Found a bug? Report it!
Have a question about your account or billing? Reach out to our customer support team!
None of the above? Find out where to ask other questions here!
The instructions in this section where you set the min-height make it seem like your text is supposed to spread out a bunch when you stretch your browser window before you set min-height to 200px. Maybe I’m just not stretching enough (maybe I don’t have a large enough monitor?) but the text is still staying close and legible without setting min-height: 200px. I think it’s because earlier in the lesson we set #blog .post to have width: 52% which is what I’m guessing is keeping the text from spreading out too much. I would appreciate anyone’s input on this
9 Likes
I agree with you. The example should have a min hight of 500px so everyone could see the example. I am able to see it in my big screen, but i am not able to see it in the small one.
6 Likes
Maybe browser defaults have changed within the last two years, but I’m not noticing any real difference with the use of min-height. When the page gets too compressed, the browser just activates scroll bars. Content formatting doesn’t change, it just goes off-screen.
5 Likes
The example can be a bit confusing, to be honest. Even when giving the <p> elements a min-height property of 500px, the textual content can still spread as if we didn’t give it a min-height. The only thing that we can see visually is that more space has been added between the <p> elements and the content underneath them (which of course is caused because they have a taller height). To actually prevent them from spreading too much is by setting their a max-width property
3 Likes
I personally find this example pretty weird and not so useful in real applications, but it’s just my personal opinion. Why someone should set a min-height for a paragraph when ‘font-size’ and ‘paddings’ can help us keep everything adjustable and following the natural flow especially with media queries in the context of responsive UIs?
1 Like
Another useless Codecademy tutorial where the instructions don’t match up to the experiece.
I feel like these lessons on min/max height/width were written before the lessons on adjusting width with rem/percentages. And I think because we already applied the other percentage changes to the page in the css code, the min/max changes don’t appear to change much.
That’s my 2cents worth.
