Igor Verve Comments - Answer Overflow

Igor Verve

Posts Comments

KPCKevin Powell - Community

•Created by Aditya Kirad on 8/21/2023 in #front-end

carousel not taking height automatically.

9 replies

KPCKevin Powell - Community

•Created by Aditya Kirad on 8/21/2023 in #front-end

carousel not taking height automatically.

@adityakirad The code pen seems to be broken rn so I can't check your example again. But div's height is automatically set by its content if we do not declare explicit height value. Have you tried min-width: 100vh instead?

9 replies

KPCKevin Powell - Community

•Created by Hamza Naeem on 8/21/2023 in #front-end

Make text, margin and padding responsive

If you want more control over that stuff then maybe it would make sense to "hard-code" different values for various breakpoints. This would ensure you have strict control over how things appear on particular screen sizes. However, that is not a very efficient way of working. Perhaps more effective way would be to declare dynamic/intrinsic value like Kevin often does in his videos, something like: padding: min(1rem, 3vw); In the example above the padding of an element will be the smallest value out of the 2. So on desktop and other large screens the padding would default to 1rem (aka usually 16 pixels), because that would be smaller than 3vw (which on big screen can be a lot) However as soon as we view our element on smaller screen then padding would be dynamically set by the value of 3vw because on smaller screens 3vw would be smaller than 1rem.
In other words the padding will always be 1rem until screen size becomes small enough where 1rem will be bigger than 3vw, then 3vw will automatically hit in.

3 replies

KPCKevin Powell - Community

•Created by Aditya Kirad on 8/21/2023 in #front-end

carousel not taking height automatically.