I’m at a loss and frustrated…I know this is something really, REALLY, simple and basic, but for the life of me, I can’t see the wood through the forest!
I’ve viewed the tutorials many times, and I think I have a pretty good understanding about setting heights and widths, but do you think I can figure out what I’ve done?
Here’s the disclaimer= I like to play with different settings to see what they do, and many times I will break things so I can learn how to recreate them again (correctly) - not always successfully.
What I don’t understand is that the settings for each element (Card) is the same in desktop view as mobile?
Yet the cards display differently.
I’ve set height as a %age (50%), while the parent is also set as a %age, the Hero Wrapper is set to 80vh.
I thought that the children of the element would take their reference from parent (Grandparent etc…)?
Although, I freely accept my understanding may be incorrect.
@knk in responsive design media queries are the root of responsive change in your work flow. when you think of 100vh and vh is view height. the vh of a mobile device is still smaller than the vh of a desktop… so when your on mobile and you have less real estate you need to tell the cards to push to a height so that the div will give you more real estate… see on desktop your columns are on the right with plenty of space below. but on mobile it stacks under so you need to open the canvas more.
)
