[英]How to align text vertically in div tag, which is inside th tag?
我已经尝试了所有方法,我想要标题旁边的红色按钮和按钮内的文本“ df”。 请建议
HTML代码:
<th style="width:11.5%;font-weight:bold;text-align:center;" valign="middle">
Table heading1
<div id="myButton1" class='myButtons' style=" text-align: left;" >df</div>
</th>
CSS:
$(".myButtons").button().css({ 'width': '15%','height' : '10px','line-height': '10px',
'padding-top': '0px',
'padding-bottom': '0px',
'font-size': '11px',
'background':'#ff0000',
'font-family': 'Century Gothic, sans-serif',
'text-align':'left',
'border-color':'#ff0000',
'border-radius':'2px',
});
您可以尝试将按钮display
属性设置为inline-block
并在其中间添加vertical-align: middle
如下所示:
$(".myButtons").css({ 'width': '15%', 'height': '10px', 'line-height': '10px', 'display': 'inline-block', 'padding-top': '0px', 'padding-bottom': '0px', 'font-size': '11px', 'background': '#ff0000', 'font-family': 'Century Gothic, sans-serif', 'text-align': 'left', 'border-color': '#ff0000', 'border-radius': '2px', });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <th style="width:11.5%;font-weight:bold;text-align:center;" valign="middle"> Table heading1 <div id="myButton1" class='myButtons' style=" text-align: left;">df</div> </th> </tr> </table>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.