Question

这是我的页面结构，有三列：30-40-30

这是小提琴：http://codepen.io/karimkhan/pen/BDfhJ

问题是：我想将div放在特定高度的右侧区域，div高度为200px。

当我将style="height:150px"放在右侧div中时，右侧div保持在顶部和左侧，中间部分保持在150px高度。

为什么？

<table border="0" width="100%">
    <tr>
        <td style="width:30%">
            <div class="left">
            Hi
            </div>
       </td>
            <td style="width:40%">
              <div class="middle"> 
                            <input type="text" id="url" width="80%">    
                            <button type="submit" onclick="GetSentiment()" value="Submit">GetSentiment</button>
               </div>
            </td>

            <td style="width:30%">
            <div class="right" style="height:150px">
                      nice

            </div>
            </td>

    </tr>

            </table>

Answer 1

这是因为默认情况下<td>元素中的文本是垂直居中的。如果您将样式应用于其他<div>元素中的<td>，则它们也会表现出来。或者，您可以为每个<td valign="top"...>执行<td>。

编辑：我注意到您上面发布的代码比您在github上发布的代码更简单。可能还有其他因素，包括影响生产代码的JavaScript或其他样式。如果没有生产HTML，CSS和脚本，就无法确定可能影响布局的所有内容。

在表格<div>中格式化<div>

1 个答案: