Centering Text in Middle of Div

Question

I'm trying to center a time inside a div. I know I am controlling it with inline css. Can do either I suppose.

Basically just trying to align text align in middle of div - vertical-align: middle; - did not work. Image is current look - u can see it is off...

current look

Thoughts?

  <div style="top: 50%; position: relative; font-family: Verdana; font-size: 10pt; color: green; height: 30px; border-top:1px solid ##000;">
  7:45 am
  </div>

Try the answer posted here: http://stackoverflow.com/questions/8865458/how-to-align-text-vertically-center-in-div-with-css — chriscoyiez, Mar 21 '15 at 14:53

score 0 · Answer 1 · edited May 23 '17 at 11:56

0

Have you read this thread?

div vertical align middle css

Maybe it will help you :)

edited May 23 '17 at 11:56

Community

1
1

answered Mar 21 '15 at 14:51

uksz

17,499
30
89
153

score 0 · Answer 2 · answered Mar 21 '15 at 14:51

0

Try text-align:center

http://jsfiddle.net/Lybfn4ph/

  <div style="top: 50%; position: relative; font-family: Verdana; font-size: 10pt; color: green; height: 30px; border:1px solid black;text-align:center;">
   7:45 am
  </div>

answered Mar 21 '15 at 14:51

Akshay

13,805
4
42
68

score 0 · Answer 3 · answered Mar 21 '15 at 14:51

0

Try this:

div {
    text-align: center;
}

answered Mar 21 '15 at 14:51

DrRoach

1,290
9
16

score 0 · Accepted Answer · answered Mar 21 '15 at 14:52

0

Add line-height style equal to height:

div {
  font-family: Verdana; font-size: 10pt; 
  color: green; 
  height: 60px;
  line-height: 60px;
  border:1px solid #000;
  text-align: center;
  width: 100px;
}

<div>7:45 am</div>

answered Mar 21 '15 at 14:52

Rick Hitchcock

34,132
4
45
75

yep worked:
– Merle_the_Pearl Mar 21 '15 at 14:59

score 0 · Answer 5 · answered Mar 21 '15 at 14:53

0

The best solution will be

<div style="top: 50%; position: relative; font-family: Verdana; font-size: 10pt; color: green; height: 30px; border:1px solid black; text-align:center;">
7:45 am
</div>

answered Mar 21 '15 at 14:53

Matthijs Otterloo

580
5
12

Centering Text in Middle of Div

5 Answers5