2 Replies - 776 Views - Last Post: 15 April 2014 - 04:27 PM

#1 mon_e_mons   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 34
  • Joined: 05-October 12

How do I center the text in this div vertically?

Posted 15 April 2014 - 04:08 PM

trying to make the px numbers sit in the very center of the shapes. Cause it looks cooler that way. How do I move only the text down on each div?

<!DOCTYPE html>

<html>
<head>
	<title>Rounded Corners</title>
	<style type="text/css">
		#round1{
			height           : 100px           ;
			width            : 100px           ;
			border           : 3px solid black ;
			border-radius    : 10px            ;
			font-weight      : bold            ;
			background-color : red             ;
			text-align       : center          ;
		}
		#round2{
			height           : 100px           ;
			width            : 100px           ;
			border           : 3px solid black ;
			border-radius    : 50px            ;
			font-weight      : bold            ;
			background-color : yellow          ;
			text-align       : center          ;
		}
		#round3{
			height           : 100px           ;
			width            : 100px           ;
			border           : 3px solid black ;
			border-radius    : 100px           ;
			font-weight      : bold            ;
			background-color : green           ;
			text-align       : center          ;
		}
	</style>
</head>
<body>
	<div id="round1">10px </div>
	<div id="round2">50px </div>
	<div id="round3">100px</div>
</body>
</html>


Is This A Good Question/Topic? 0
  • +

Replies To: How do I center the text in this div vertically?

#2 andrewsw   User is offline

  • palpable absurdity
  • member icon

Reputation: 6916
  • View blog
  • Posts: 28,598
  • Joined: 12-December 12

Re: How do I center the text in this div vertically?

Posted 15 April 2014 - 04:23 PM

        div {
            line-height: 100px;
        }

Was This Post Helpful? 2
  • +
  • -

#3 mon_e_mons   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 34
  • Joined: 05-October 12

Re: How do I center the text in this div vertically?

Posted 15 April 2014 - 04:27 PM

Thank you very much, my good sir!
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1