No solution for centering CSS text vertically that doesn’t make the scrollbar appear [duplicate]

  Kiến thức lập trình

So I have been at this for a few hours. I am trying something extremely simple for an introduction to CSS and HTML. I want to center a word vertically and horizontally. However, everytime I try to center it vertically, the scrollbar appears. Here is my html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport">
<link rel="stylesheet" href="style.css">
<title>home</title>
</head>
<body>
<div class="center">hello</div>
</body>
</html>

And here is my css

.center {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
overflow: hidden;

}
I’ve narrowed it down to the height: 100vh; however, nothing I do seems to fix the scroll bar appearing issue.

1

LEAVE A COMMENT