Return to Snippet

Revision: 35957
at November 15, 2010 11:51 by eisabai


Initial Code
#enter {
	position: absolute;
	text-align: center;
	left: 50%;
	top: 50%;
	margin: -120px auto 0 -130px; /* value of top margin: height of the image divide by 2 (ie: 240 / 2), value of left margin: width of the image divide by 2 (ie: 260 / 2) */
	width: 260px; /* same as the image width */
}

#enter span a {
	display: block;
	width: 260px;
	height: 240px;
	margin: 0 auto;
	position: relative;
	background: transparent url(images/enter.jpg) 0 0 no-repeat;
	text-indent: -5000em;
	outline: 0;
}




<body id="homepage">
    <div id="enter">
	<span><a href="/home">Enter Site</a></span>
    </div>
</body>

Initial URL
http://eisabainyo.net/weblog/2010/04/22/align-an-image-in-center-and-middle-using-css/

Initial Description


Initial Title
Align image in the middle and center of the page

Initial Tags
css, html

Initial Language
CSS