I'm having problems centering the background image within a certain div. I'm using the following code for CSS:
.background3 {
max-width: 90%;
height: 400px;
margin: 0 auto;
background: linear-gradient( rgba(86, 71, 71, 0.56), rgba(86, 71, 71, 0.56)), url(img/kitpage.jpg) no-repeat 50% 50%;
}
I've tinkered and tried, but to no avail. I'm pretty sure it's an easy answer, and thank you all in advance for your help and advice.
A screenshot of the problem is attached below
在CSS中使用以下内容:
display: block;
You have to use background position property eg:
.background3 {
max-width: 90%;
height: 400px;
margin: 0 auto;
background-position:20% 20%; // Margin background from top and left
}
You can adjust margin as you need but it's not a good way. If you want more proper way then try this:
.background3 {
max-width: 90%;
height: 400px;
margin: 0 auto;
background-size:auto 100%;
background-position:center center;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.