css code not working across all devices
i hv a about page for an event, and its not working across all devices. on some devices, the font is fitting perfectly, but on my laptop the text is overflowing over the edges
1 Reply
.about {
color: #ffffff;
display: flex;
background-image: url(bg_abt.jpg);
align-items: center;
justify-content: center;
background-repeat: no-repeat;
background-size: cover;
gap: 10rem;
font-size:3.3rem;
max-width:80vw
}
.about-content{
text-align: right;
/* max-width: 100%; /
animation: fade-in linear;
animation-timeline: view();
}
.about h3{
white-space: nowrap;
/ word-wrap: break-word; /
/ max-width: fit-content; /
}
.about img{
animation: fade-in linear;
animation-timeline: view();
transition: 0.3s ease;
width: 24vw;
}
.about img:hover{
scale: 1.3;
/ box-shadow: 0 0 8px 8px var(--top-font); */
}
here is the code
got it nvm