How can I center h1 in my div?

HTML & CSS
1

Hello there. I am newbie trying to learn something by creating my own page for the first time but at the very beginning, in logo I encouraged first problem. How may I center the h1 in div?

edit. vertically I mean

<!DOCTYPE html>
<html>
	<head>
		<title>Project #1</title>
		<link rel="stylesheet" href="css/style.css">
		<link href="https://fonts.googleapis.com/css?family=Lato:400,700,900" rel="stylesheet"> 
		<meta charset="UTF-8">
		<meta name="description" content="project1">
		<meta name="keywords" content="project1">
	</head>
	<body>
		<div id="container">
			<div id="logo">
						<img class="logoimg" src="img/wolf.png" style="float:left">
						<h1 class="logoheader">gamers site warewolf.com</h1>
						<div class="clearfix"></div>
			</div>





		</div>
	</body>
</html>

html, body {
	font-family: 'Lato', sans-serif;
	background-color: #4d4d4d;
	margin: 0;
	width: 100%;
}

#clearfix {
	clear:both;
}


#container {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

#logo {
	height: 240px;
	margin-top: 80px;
	background-color: #808080;
	font-size: 40px;
	text-align: center;
}

.logoimg {
	width: 197px;
	height: 220px;
	padding: 10px;
	border-right: dashed 3px #4d4d4d;
}

.logoheader {
	display: block;
	
}
2

Try this:

#logo {
    display: flex;
    justify-content: space-between;
}
h1
    display: flex;
    align-self: center;
3

It worked. Thanks buddy, helped me a lot!

4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.