how to make the text in the middle
i have following code i want the text in the div to come in the middle . i know this is very easy question but i am getting problem in these type of questins please suggest me the what can i do to solve these kind of problems in future.
<!DOCTYPE html>
<html>
<head>
<style>
.transition-msg {
background-color:#000000;
font-size:20px;
height:624px;
color:#fff;
margin:0 auto;
position:absolute;
text-align:center;
top:6%;
width:1014px;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"&开发者_开发百科gt;</script>
</head>
<body>
<div style="display: block;" class="transition-msg" id="transition-msg">Entering rahuls Gib</div>
<script>
</script>
</body>
</html>
Remove position:absolute;
and it should work just as you want it to.
<div style="display: block;" class="transition-msg" id="transition-msg"><div class="transition-msg1">Entering rahuls Gib
</div>
.transition-msg-text{
background-color:#000000;
font-size:20px;
height:624px;
color:#fff;
display:table-cell;
margin:0 auto;
vertical-align:middle;
text-align:center;
width:1014px;
}
<style type="text/css">
.transition-msg{
width:1014px;
height:600px;
background-color:#000000;
position:absolute;
color:#fff;
font-size:20px;
left:15%;
text-align:center;
top:6%;
}
</style>
You can achieve this by removing position absolute.
精彩评论