html - 按钮和文本偏移 HTML

Question

这是我在这里的第一篇文章。我在一个网站上工作，我使用了一个表格来分隔不同的链接，但是我试图在一个数字旁边放置一个按钮，该按钮将通过我的数据库进行更新。我的问题是文本和按钮偏移了，我无法让它们彼此水平。有什么想法吗？

我不能发布图片，因为我没有 10 个声誉...

<tr>
    <td><img src="images/logo.png" alt=""/></td>
    <td>

    <strong><font size="8">3.5</font></strong>
    </td>
    <td>
    <button type="button" id="XYZ" class="btn btn-info btn-lg rateme" data-toggle="modal" data-target="#modal">Rate it!</button>

    </td>
    <td>
      <a href="http://www.example.com">
      <button type="button" class="btn btn-lg btn-default">Visit Site!</button>
      </a>
      </td>
  </tr>

Answer 1

这似乎是一个垂直对齐问题，要解决它只需将以下属性添加到您的 <font>标签:

style="vertical-align: middle;"

所以你完成了<font>标记应如下所示:

<font size="6" style="vertical-align: middle;">3.5</font>

所有的结果应该是这样的:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
    <td><img src="images/logo.png" alt=""/></td>
    <td>

    <strong><font size="6" style="vertical-align: middle;">3.5</font></strong>
    </td>
    <td>
    <button type="button" id="XYZ" class="btn btn-info btn-lg rateme" data-toggle="modal" data-target="#modal">Rate it!</button>

    </td>
    <td>
      <a href="http://www.example.com">
      <button type="button" class="btn btn-lg btn-default">Visit Site!</button>
      </a>
      </td>
  </tr>