Question

我在<a>表单中的html中有一个img作为<td>标记，我试图将它对齐; 我的结构是：

<td><span class="AlertaOK"><a title="Processado"></a></span></td>

我试过像这样的居中对齐，垂直对齐：

<td style="vertical-align: middle; text-align: center;">

我的（部分）css：

{
background: url(../images/sprite-icons.png) -297px -149px no-repeat center !important;
color: transparent !important;
height: 15px !important;
color: transparent !important;
display: block !important;
width: 17px !important;
float: right !important;
border: 15px !important;
text-indent: -9000px !important;
padding: 0 0 0 0;
margin-left: 1px;
line-height: 100%;
}

我该如何实现？

Answer 1

您可以<a>与<td>一样大，然后在@ BhojendraNepal的答案中使用background-position，或者您可以为{{1}提供任意尺寸}，并以

为中心

<a>

如以下代码段所示：

＆＃13;

    display : block;
line-height : 100%;
     margin : 0 auto;

＆＃13;

td {
  border: 1px dashed red;
}

div {
  height: 300px;
  width: 300px;
}

a{
    background-image : url('http://newbleep.com/wp-content/uploads/2014/02/stackoverflow.png');
         width : 128px;
        height : 128px;
       display : block;
   line-height : 100%;
        margin : 0 auto;
        border : 1px solid green;
}

＆＃13;

Answer 2

由于您使用的是背景图片，因此您需要将该背景置于background-position: center的中心，或者您可以使用：

.AlertaOK a{
   background: url(path.jpg) no-repeat center;
}

对齐<a> inside a td in css</a>

2 个答案: