dgmike
12/6/2010 - 9:45 PM

Alinhando uma div verticalmente. Baseado no código do CSSplay

Alinhando uma div verticalmente. Baseado no código do CSSplay

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>

<title> Stu Nicholls | CSSplay | Centering an image using CSS</title>

<style type="text/css"> 
/* for non-IE browsers */
div.holder {width:748px; height:300px; background:#f8f8f8; border:1px solid #777; text-align:center; display:table-cell; vertical-align:middle;}
div.holder img {margin:0 auto; border:1px solid #aaa;}
</style> 
<!--[if lte IE 7]>
<style type="text/css">
/* vertical align for IE6 and IE7*/
div.holder {text-align:left;}
#edge {width:0; height:100%; display:inline-block; vertical-align:middle;} 
#container {text-align:center; width:100%; display:inline-block; vertical-align:middle;}
</style>
<![endif]-->


<body id="www-cssplay-co-uk">

<div id="info">

<div class="holder">
<span id="edge"></span> 
<span id="container"><img src="graphics/homework.jpg" alt="Homework" title="Homework" /></span>
</div>

</body>
</html>