如何在文本框中间放置超链接？

我想垂直放置一个超链接，所以它的文本框的高度中间，但它不适合我。如何在文本框中间放置超链接？

这里是jsfiddle的例子。我想这样做，而不使用Javascript，在IE6 +中工作，这两个元素需要在同一个td列中，而不使用硬编码像素，而超链接恰好在文本框的右边缘旁边（就像它显示的那样这个例子，只是将它向上移动到黄色框的中间）。

2012-01-27 Tony_Henrich

你为什么使用表格？ – 2012-01-27 22:47:22

@Abhijeet它是表单的一部分。 – 2012-01-27 22:52:06

“这两个元素需要在同一个td中”......除非我们被允许嵌套另一个表或导入一个大的强大的CSS框架（比如twitter引导程序），那么你就是在努力工作。 – perfectionist 2012-01-27 22:54:08

只要textarea和一个元素是内联元素，他们将共享他们的基线。如果浮动的元素，你可以设置一个元素的行高匹配textarea的高度：

textarea { float :left; } 
a { float: left; line-height: 6em; }

演示：http://jsfiddle.net/Guffa/aLtXA/6/

来源

2012-01-27 22:50:55 Guffa

有没有使用硬编码值的方法？ 6em。 – 2012-01-27 22:55:49

@Tony_Henrich：好吧，不容易。该值基于textarea中的行数，另外还有一些用于填充，边框和边距。您可以使用另一个表格，以便您可以使用垂直居中，但表格的行为很难预测，因此我在布局中避免它们。 – Guffa 2012-01-27 23:10:09

好吧，如果你是愿意窝表，这将工作：

<table> 
    <tr style="vertical-align:top"> 
    <td> 
     <table> 
     <tr style="width: 500px;"> 
      <td> 
      <textarea cols="45" rows="5"></textarea> 
      </td> 
      <td style="background-color:yellow; vertical-align:middle"> 
      <a href="">Edit</a> 
      </td> 
     </tr> 
     </table> 
    </td> 
    <td> 
     second cell 
    </td> 
    </tr> 
</table>

但我讨厌这个级别嵌套的地狱。它导致疯狂和灰白的头发。

我希望有人会发布一个更好的答案。是否有可能也许与twitter bootstrap?

来源

2012-01-28 00:02:36 perfectionist

“将工作” - 在铬。我没有测试过多个浏览器，而且def。不是IE6。 – perfectionist 2012-01-28 00:03:20

在这里你去：http://jsfiddle.net/aLtXA/16/

我把垂直对齐：中间的文本框和锚。同样，我从表格单元中删除了垂直对齐。

来源

2012-01-28 16:27:17 Matthew

好奇，如果这在IE6中工作。可以？ – Matthew 2012-02-01 03:06:53