Trouble turning image into a banner?

I completed the exercise Dasmoto’s Arts & Crafts but had a lot of issues getting the banner and text right. I tried to do it a few different ways and the image either wasn’t visible or it covered the entire page. I used a code example I found online and was able to make it work.

Basically, I’m just wondering why the more simple methods didn’t work here? I’m only a week into doing this so I’m assuming I missed something obvious. I’ve linked to the project below. I appreciate any help and advice you all have. Thanks!

1 Like

You should really look into seeing what the display attribute can do for you in css. It’s a very powerful tool to craft a website in versatile ways.

They come in different varieties and they can be useful for different types of things. Common display attributes are: inline, block, grid, flex, and none (if you want to make something not show up).

You can even have different element containers have different display settings, which gives the opportunity for very fluid organization.

Play around with the browser dev tools by right-click and inspecting element. There really is a ton of stuff you can figure out like this after a while of getting used to it.

The MDN documentation is really exemplary in its explanations of CSS attributes:

There’s also a very good youtube channel run by Kevin Powell that has a clear, pragmatic, and effective approach to CSS (and passionate to boot). I also often go back to videos I’ve seen for inspiration and reference.

1 Like

Thanks so much!! I’ll play around with it some more tomorrow

1 Like

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.