DEV Community

Discussion on: Creating a pure responsive CSS Grid Hero Image or Banner Image

Collapse
 
pllffrd profile image
pllffrd

Nice touch on the typography! It makes a huge difference in readability. Try using VH instead of pixels for the height of the banner, this way it’s always proportional to the users viewing area. Also, use a child combinator to avoid writing so many class names. You can target the children of your Div like this:
.banner-text-div > h1 {
Styles: here;
}
.banner-text-div > p {
Styles: here;
}
developer.mozilla.org/en-US/docs/W...

Collapse
 
billraymond profile image
Bill Raymond

Thanks for sure VH idea! I will play with implementing that on the project I start today, so it’s a timely idea. Yes, I have a tendency to do that with CSS so thank you for the reminder :)