Các bác giúp em với ạ. Giao diện chỉ hiển thị với điện thoại, còn hiển thị với máy tính ạ. Em vẫn không tìm ra lỗi:
HTML:
<div id="head-background">
<img id="head-image" src="assets/images/ava_Do.png" alt="Placeholder">
</div>
CSS:
@media all and (min-width: 320px) {
#head-background {
height: 15%;
position: relative;
background-image: url(../assets/images/image.png);
/* Center and scale the image nicely */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: 0;
}
#head-image {
border-radius: 50%;
left: 15%;
max-width: 250px;
position: absolute;
top: 110%;
transform: translateY(-75%);
z-index: 1;
}
}
@media all and (min-width: 768px) {
#head-background {
height: 35%;
position: relative;
background-image: url(../assets/images/image.png);
/* Center and scale the image nicely */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
z-index: 0;
}
#head-image {
border-radius: 50%;
left: 15%;
max-width: 250px;
position: absolute;
top: 135%;
transform: translateY(-75%);
z-index: 1;
}
}
Em cảm ơn các bác.