如何对齐Td中的项目?

阿努沙蜂蜜

这是我桌子的一部分。我在td中有一个按钮和2张图像。我想将它们移到中心。我该怎么做?我已经尝试填充,保证金。但是它们不起作用。

<td align="center" style="width: 200px;">

  <input type="button" name="submit" onClick="mySubmit();"
         style="position: relative; float: left; top: 10%" value=" GO ">

  <a href="#" style="position: relative; float: left; top: 2%;" onClick="mySubmit();">
    <img src="../images/refresh.png" style="position:relative;">
  </a> 

  <input type="checkbox"  name="upsCheckbox" id="upsCheckbox" onChange="setRefresh(this.checked)"/>

  <a href="#" style="position: relative; float: left; top: 2%;" onClick="enterFullscreen();">
    <img src="../images/FullScreen.jpg" style="position: relative; top:2%;">
  </a>

</td>
比塞洛普

示例:http//jsfiddle.net/VEJk7/

简化的HTML:

<table>
  <tr>
    <td style="width: 400px;">
      <input type="button" value=" GO ">
      <a href="#"><img src="1.jpg"></a> 
      <input type="checkbox">
      <a href="#"><img src="2.jpg"></a>
    </td>
  </tr>
</table>

CSS:

td {
    vertical-align: middle;
    text-align: center;
}

td a, td input, td img {
    vertical-align: middle;
    display: inline-block;
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

尝试将TD中的居中对齐按钮

来自分类Dev

Visual C#-如何在Winforms中对齐项目?

来自分类Dev

在表中对齐td

来自分类Dev

如何在React Native中模拟“对齐项目:基线”?

来自分类Dev

我如何在Bootstrap 4 Card Header中对齐项目

来自分类Dev

如何在vuetify中水平对齐项目

来自分类Dev

如何在SwiftUI中将项目对齐到VStack中的顶部?

来自分类Dev

如何使用Flexbox对齐HTML中的项目

来自分类Dev

水平对齐不同TD中的输入

来自分类Dev

如何将文本输入与<td>中的排序按钮对齐?

来自分类Dev

如何对齐列表中的项目CSS / jquery

来自分类Dev

如何在gridview项目模板中隐藏tr td?

来自分类Dev

如何在Android中的GridView顶部对齐项目?

来自分类Dev

td中的HTML CSS对齐

来自分类Dev

如何对齐<td>内剩余的跨度文本?

来自分类Dev

如何左右对齐<td>

来自分类Dev

在表中对齐td

来自分类Dev

在div或td中居中对齐ap元素

来自分类Dev

如何对齐表格单元格(<td>)中的元素?

来自分类Dev

在td元素中对齐类

来自分类Dev

如何正确对齐这些项目?

来自分类Dev

在GridView中对齐项目

来自分类Dev

在td中对齐项目

来自分类Dev

如何在Ionic2中对齐项目?

来自分类Dev

如何使列表中的项目符号点对齐

来自分类Dev

对齐网格中的项目

来自分类Dev

对齐 Flexbox 中的项目

来自分类Dev

如何在 Bootstrap 4 中垂直对齐项目?

来自分类Dev

在嵌套表中对齐 td