AnythingSlider: Vertical align middle text

510 Views Asked by At

I am using the AnythingSlider JQuery Content slider and am having a hard time trying to vertically center in the middle a piece of text. I have tried the following but doesn't work.

<li>
    <div style="display:table-cell; vertical-align:middle;"> 
        <h1> THIS IS A TEST!! </h1> 
    </div>
</li>
1

There are 1 best solutions below

0
On BEST ANSWER

Do your li-elements have a fixed height? If so you could try using CSS and add "line-height: (same height as li)" and "vertical-align: middle".

(By the way, I don't think you should be using divs inside a li)

working example: http://jsfiddle.net/jc7CE/

CSS:

li{
float: left;
height: 100px;
width: 100px;
line-height: 100px;
vertical-align: middle;
border: 1px solid red;
padding: 10px;
}