Problem with linear-gradient on image background [duplicate] - html

Question

This question already has answers here:
How do I combine a background-image and CSS3 gradient on the same element?
(20 answers)
Closed 4 months ago.
i have a problem with a div that has an image as a backround.
When I try to give it the linear gradient, the background disappears.
Thanks for the help and sorry for the triviality of the question, but I'm a beginner
.facebook{
background-image: url(/img/facebook.jpg) linear-gradient(from left, 1 , 0);
}
.menu2style{
border-top: solid 2px white;
border-bottom: solid 2px white;
height: 24.5%;
display: flex;
padding-left: 30px;
background-repeat: no-repeat;
background-size: cover;
font-family: 'Bungee Outline', cursive;
font-weight: 900;
font-size: 90%;
justify-content: flex-start;
color: white;
padding-right: 25%;
<div class="camera2">
<div class="menu2">
<div class="menu2style facebook">FACEBOOK</div>

Answer 1

For example:
.facebook {
background-image: url(https://images.unsplash.com/photo-1665507254439-fe45f1417c13?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwxNHx8fGVufDB8fHx8&auto=format&fit=crop&w=600&q=60), linear-gradient(to left, #000 50%, #fff 0%);
}
.menu2style {
border-top: solid 2px white;
border-bottom: solid 2px white;
height: 24.5%;
display: flex;
padding-left: 30px;
background-repeat: no-repeat;
background-size: cover;
font-family: 'Bungee Outline', cursive;
font-weight: 900;
font-size: 90%;
justify-content: flex-start;
color: white;
padding-right: 25%;
}
<div class="camera2">
<div class="menu2">
<div class="menu2style facebook">FACEBOOK</div>
</div>
</div>