Websites with a image background as a boarder

Question

Im coding a website and was wondering what code this would be? Ive seen sites that have an image behind a white layout, I’ve tried flexboxes but they refuse to work m with my drop down navs.

So what else should I use for this result.

Example https://images.app.goo.gl/S1qFV8onxkDaQMHy9

I know how to add images to the code but not how to get the effect of a box over the top.

Answer 1

Border: 4rem solid url('img.png')

Or

Create a div with the background image of the image
And insert a child div with background color: white;

And set padding, setting the child element of the background image div hight and width to 80%

Also for the background image div

Do this

Display: flex;
Justify-content: center;
Align-items:center;

Answer 2

Checkout This Link:

https://www.youtube.com/watch?v=83m3jwY63vQ