Skip to content

Instantly share code, notes, and snippets.

@QROkes

QROkes/index.html

Created March 6, 2016 00:21
Show Gist options
  • Save QROkes/f787b6f2edc47513d9d4 to your computer and use it in GitHub Desktop.
Save QROkes/f787b6f2edc47513d9d4 to your computer and use it in GitHub Desktop.
Download ZIP
How to center an image (vertically & horizontally) on a simple HTML web page.
Raw
index.html
<!DOCTYPE html>
<html lang="es-MX">
<head>
<meta charset="UTF-8" />
<title>Tituo de la pagina</title>
<meta name="description" content="Agregar descripcion">
<style type="text/css"> <!--Fix width, height and margin -->
img {
width: 600px;
height: 340px;
margin-top: -170px;
margin-left: -300px;
left: 50%;
top: 50%;
position: absolute;
}
</style>
</head>
<body>
<img src="http://domain.com/image.jpg" alt="Agregar texto alternativo" width="600" height="340" />
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment