I have seen this question asked many times during the interview process. So I decided to write the syntax.
<html>
<head>
<title>Create a div horizontally and vertically centered</title>
<style type="text/css">
div {
width: 100px;
height: 100px;
background-color: red;
display:table;
position: absolute;
top:0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
display: table-cell;
vertical-align: middle;
text-align:center;
}
p {margin:0; line-height:100px;}
</style>
</head>
<body>
<div><p>Hello World</p></div>
</body>
</html>
No comments:
Post a Comment