For some reason, I can't seem to get my elements centered on both pages I'm working on. I have the elements to step into the page by 50% the viewport and then translate back 50%, among a few other things.
The notable html :
<body>
<h1><ku>ク</ku><ri>リ</ri><su>ス</su></h1>
</body>
The notable css:
body {
background-color: rgb(0, 0, 0);
margin: 0;
}
h1 {
color: white;
width: fit-content;
height: fit-content;
margin: 0;
position: relative;
top: 50vh;
left: 50vw;
transform: translate(-50%,-50%);
}
P.S:
How do I best position elements on a page freely so page size doesn't affect them, in relation to both centering and other.
I've tried many things I've looked up and sketched it out to see if the math worked out, and I just can't seem to figure it out, but it doesn't seem to work.
