Hi,
I am having the same problem on my page:
https://2brosandatruck.com/test/
The image is not showing on the live webpage, but it does show in dreamweaver source. Can you please help me with the CSS code?
image is 1998 pixels width X 348 pixels length
HTML:
<h2 style=”font-size:50px”>Connecticut’s Finest Movers</h2>
<p>Family owned & operated: New Haven County, CT</p>
CSS:
/* hero image css */
body, html {
height: 100%;
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}
.hero-image {
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(“https://2brosandatruck.com/wp-content/uploads/2020/11/NewHavenSkyline2000x.jpg”);
height: 50%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}
.hero-text {
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
}
.hero-text button {
border: none;
outline: 0;
display: inline-block;
padding: 10px 25px;
color: black;
background-color: #ddd;
text-align: center;
cursor: pointer;
}
.hero-text button:hover {
background-color: #555;
color: white;
}
/* hero image css */