Never been to DZone Snippets before?

Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

« Newer Snippets
Older Snippets »
Showing 1-3 of 3 total  RSS 

CSS *true* centering

This will truely center something in CSS. Not tested in IE, knowing IE, it will burn in flames.

#center-me { /* There can be only one Centerlander! */
  height: 100%;
  display: table !important;
  margin: auto;
}

#center-me > * {
  display: table-cell !important; /* Don't touch me! I MEAN IT! DON- ... don't touch me. Really, don't touch me. */
  vertical-align: middle !important;
}



<div id="center-me">
  <h1>I'm centered!</h1>
</div>

to css layout simple center centering true horizontal vertical placement by elliottcable on Mar 19, 2008 1 Comments

Center HTML content horizontally using CSS

Ahh the infamous CSS centering thing... make sure to specify the width and set the right/left margins to 'auto'

#content {
        margin: 0 auto;
        width: 740px;
}


Your HTML would look something like this:
<div id="content">
        This is centered
</div>
to html css center by alexwilliams on Dec 20, 2006

Centered Box HTML and CSS

// HTML for web page with the content centered both vertically and horizontally

<html>
	<head>
		<title>Centered HTML w/ CSS</title>
		<style type="text/css" media="screen">
			body, html { height:  100%; background-color:#000; }
			#outer { height: 100%; width: 100%; overflow:  visible; position: relative; }
			#outer[id] { display: table; position: static; }
			#middle { position: absolute; top: 50%; }
			#middle[id] { display: table-cell; vertical-align: middle; position: static; }
			#inner { position:  relative; top: -50%; text-align: center; }
			#inner[id] { position: static; text-align: center; }
		</style>
	</head>
	<body>
		<div id="outer">
			<div id="middle">
				<div id="inner">
						This is the content
				</div>
			</div>
		</div>
	</body>
</html>
to html css web centered center by jasonbentley on Nov 03, 2006
« Newer Snippets
Older Snippets »
Showing 1-3 of 3 total  RSS