0

i'm tring to vertically align a text that's inside of a div.

But for some reason vertical-align doesn't work.

.CV{
width: 100px;
height: 150px;
margin-left:auto;
margin-right:auto;
background-color: #89BC23;
text-align: center;
vertical-align: middle;
}

Here is what i have for now:

http://jsfiddle.net/rM5Jz/

line-height doesn't work since i have two lines.

What am i missing?

Regards

Pedro Lino
  • 601
  • 1
  • 9
  • 18
  • possible duplicate of [Vertically Align text in a Div](http://stackoverflow.com/questions/2939914/vertically-align-text-in-a-div) – Justin808 Mar 30 '14 at 16:40
  • possible duplicate of http://stackoverflow.com/questions/9249359/text-vertical-align-in-a-div – Justin808 Mar 30 '14 at 16:41
  • possible duplicate of http://stackoverflow.com/questions/8865458/how-to-align-text-vertically-center-in-div-with-css – Justin808 Mar 30 '14 at 16:42

2 Answers2

1

Without to add additional markup and flexible text length: http://jsfiddle.net/rM5Jz/8/

#slide-container {
    margin: 0 auto;
    padding: 12px;
    border: 1px solid #ebebeb;
}

#slide-container a {
    display:table;
    width: 100px;
    height: 150px;
    margin:0 auto;
}

.CV {
    background-color: #89BC23;
    display:table-cell;
    vertical-align:middle;
    text-align:center
}
gearsdigital
  • 13,915
  • 6
  • 44
  • 73
1

I've updated your example vertical align. In short, here you want to position the text depending on CV, i.e. best way is to use position:absolute; which is cross-browser solution

Borys Generalov
  • 2,255
  • 17
  • 19
  • This is more markup as needed and **more important** this does not work for three or more lines of text. http://jsfiddle.net/rM5Jz/12/ – gearsdigital Mar 30 '14 at 16:34