2

I am trying to get this:

http://img16.imageshack.us/img16/2198/screenshot20130304at146.png

But after 2 hours I have this:

http://imageshack.us/photo/my-images/138/screenshot20130304at152.png

The problem is I have no idea of how align the text on the button without using javascript, only with css. There is anyway to do this without Javascript? This is my code:

<div class='chart_button'>
    <div>Pain Relief</div>
</div>
<div class='chart_button'>
   <div>Pain relief by attack</div>
</div>

and here is the css:

.button_set .chart_button{
    display: inline-table;
    height: 50px;
    width: 110px;
    background: url('../img/button-chart.png');
    font-size: 14px;
    font-weight: bold;
    color: #717171;
    text-align: center;
    margin-right: 1px;
    cursor: pointer;
    vertical-align: bottom;
}
4

1 回答 1

8

添加这个CSS：

.chart_button>div {
    display:table-cell;
    vertical-align:middle;
}
于 2013-03-04T14:01:14.563 回答