I have two images aligned vertically inside a wrapper. How do I center the wrapper within the body?
What is the best way to center my wrapper inside the body?
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<base href="<?php echo BASE; ?>">
<title>Page Title</title>
<meta name="description" content="Description goes here">
<style type="text/css">
body {margin: 0; padding: 0;}
.wrapper {background-color: red; display: inline-block;}
.wrapper span {display: inline-block; vertical-align: middle; margin: 0 20px;}
.wrapper span img {display: block;}
</style>
</head>
<body>
<div class="wrapper">
<span><a href=""><img src="..." width="225" height="60" alt="..."></a></span>
<span><a href=""><img src="..." width="120" height="120" alt="..."></a></span>
</div>
</body>
</html>