Before I delve into the issue I'm facing, I want to emphasize that despite searching for existing solutions, I have not been able to find one that works. This problem has been blocking me for a week now, and I am in desperate need of assistance. The issue at hand is related to creating a website that works perfectly on my screen resolution but goes haywire on other screens. The elements seem to overlap and behave strangely. Here is the snippet of my code:
@font-face {
font-family: Comfortaa;
src: url(Comfortaa-Regular.ttf);
}
@font-face
{
font-family: Comfort;
src: url(ChampEtLimou.ttf);
}
body
{
background-color : rgb(255,255,255);
}
.titre3
{
color : #0183c0;
font-family : Comfortaa;
position: fixed;
font-size :50px;
z-index:10;
left : 43.2%;
top:-6%;
}
...
<!doctype html>
...
body>
Any assistance provided is greatly appreciated!