Trying to make a small banner that showcase promotions etc. I did this before, but I forgot how to do it again. Would like to know if any of you know how to make it. Inserted a picture as a reference, *
Hi @BioDraft
Could you share that page link so I can check and provide the solution?
Hi, @BioDraft .
Kindly share your store URL and password.
Hi @BioDraft
Please go to your Online store > Themes > Customize > + Add section and then add Image banner section
That’s not the kind of banner we want. It is too big and it’s full width.
Please add it then I can provide the code to make it smaller as you want
You want banner video fix the dekstop.
I believe that is done, kindly check it. 
Please add this code in Custom CSS in directly of that section on your customize page
.banner {
min-height: 26rem !important;
max-width: 400rem !important;
margin: 0 auto !important;
}
That works well, but any chance you can make some spaces between the banner?
Space between image banner and your video?
Also, when in mobile version. It doesn’t adjust to it, would like to know is there any solution for that as well.
Nope. Just the banner.
Please update the code to this and check
.banner {
min-height: 26rem !important;
max-width: 400rem !important;
margin: 20px !important;
}
Go to Online Store → Themes → Edit code.
Go to Assets folder → Base.css file.
Add the following code at the bottom of the file .
@media (min-width: 320px) and (max-width: 767px) {
#shopify-section-template--16877801439464__335dc814-9b66-4080-8634-5707016a5199 .banner {
min-height: 8rem !important;
}
}
Result:
I managed to help you then, don’t forget to Like it and Mark it as Solution
Your solution doesn’t seem to work after I applied your codes. 
This code doesn’t seem to work very well… Very sorry. Thank you though.
Your image does not fit for mobile so I recommend you add another image for mobile device.