html - 文本未在 2 列中对齐

标签 html css

我有一行有 2 列,其中有一些文本:My Website Example .我不明白为什么 2 列上的文本没有对齐?右侧的文字比左侧飞得更多。它们应该对齐。

这怎么可能?

CSS较多,这里没有复制代码。但是有一个jsfiddle here .

<body>
  <table class="body">
    <tr>
      <td class="center" align="center" valign="top">
        <center>
            <table class="row footer">
                <tr>
                    <td class="wrapper">

                      <table class="six columns">
                        <tr>
                          <td class="left-text-pad">

                            <h5>A Headline</h5>

                            <table>
                              <tr>
                                <td>
                                  <strong>Detaljer om værelset:</strong>
                                </td>
                              </tr>
                            </table>

                            <h5>A Headline</h5>

                            <table>
                              <tr>
                                <td>
                                  A content text 2
                                </td>
                              </tr>
                            </table>

                            <h5>A Headline</h5>

                            <table>
                              <tr>
                                <td>
                                  A content text 3
                                </td>
                              </tr>
                            </table>
                          </td>
                          <td class="expander"></td>
                        </tr>
                      </table>

                    </td>
                    <td>
                     <table class="six columns">
                        <tr>
                          <td class="left-text-pad">

                            <h5>A Headline</h5>

                            <table>
                              <tr>
                                <td>
                                  A content text 1
                                </td>
                              </tr>
                            </table>

                            <h5>A Headline</h5>

                            <table>
                              <tr>
                                <td>
                                  A content text 2
                                </td>
                              </tr>
                            </table>

                            <h5>A Headline</h5>

                            <table>
                              <tr>
                                <td>
                                  A content text 3
                                </td>
                              </tr>
                            </table>
                          </td>
                          <td class="expander"></td>
                        </tr>
                     </table>
                    </td>
                </tr>
            </table>
        </center>
      </td>
    </tr>
</table>
</body>

最佳答案

你的类“包装器”有填充,但它只在左表而不是右表

关于html - 文本未在 2 列中对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41953897/

相关文章:

php 复选框总是显示已选中

html - 对齐表格中图像下方的文本

javascript - 修复 Nestable 的 dd-content 中的 css 显示问题?

css - 如何在html和css中制作一个始终在底部的元素

javascript - 如何使用 javascript/jquery 获取数组中选中和未选中的复选框值

java - HTML 输入按钮位于 div 中

css - 在struts2中隐藏loader(spin)

css - Internet Explorer 显示 : table issue

html - 从 chrome 检查器永久更改网页的背景

jquery - ie8 样式表中的媒体查询