HTML/CSS: Why is my text not vertically aligning? -


i feel crazy. here jsfiddle working solution how vertically center text. it's this question.

but when copy , paste html , css local files, cannot replicate. here code:

this html , css:

<html>     <head>         <link type='text/css' rel='stylesheet' href='main.css'>     </head>     <body>         <div>             <span>lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>         </div>     </body> </html> 

and

div {     border: 1px solid black;     width: 250px;     height: 100px;     line-height: 100px;     text-align: center; } span {     display: inline-block;     vertical-align: middle;     line-height: normal;       } 

this doesn't work. here screenshot. in world going on?

you have specify doctype. if add top of html file, work. cause page html5 instead of, believe, transitional.

<!doctype html> 

fool around dtd section in fiddle options on left, , can reproduce non-centred version.


Comments

Popular posts from this blog

c++ - Difference between pre and post decrement in recursive function argument -

php - Nothing but 'run(); ' when browsing to my local project, how do I fix this? -

php - How can I echo out this array? -