Question

首先是演示网站的链接： http://lustigelanguste.de/eventpoll/eventpoll.php?id=6512bd43d9caa6e02c990b0a82652dca

此问题仅发生在Google-Chrome上。 Firefox和IE似乎工作得很好......

正如您所看到的，如果在数据输入行之前的最后一行有一个长名称，Chrome会更改表格单元格的高度（在这种情况下：开头的行包含“WWWWWWW ....”）

我希望每一行设置为相同的高度。我已经尝试给孩子DIV一个max-height属性并设置overflow：hidden;，它有点工作，但是我的hover-over-buttons不能再显示了。

表格代码（摘录）：

<td id="auswahlname">
    <div class="hoverbuttons">'.$auswahl["Namen"].'
        <span class="showbuttons">
            <form method="post" action="./eventpoll.php">
                <input type="submit" class="delbutton" name="auswahlentfernen" value="entfernen" title="Das L&ouml;schen einer Auswahl ist unwiderruflich.">
                <input type="submit" class="editbutton" name="auswahledit" title="Auswahl editieren" value="edit">
            </form>
        </span>
    </div>
</td>

CSS：

DIV.contentwithtopnav table {
    margin-top:40px; 
    margin-bottom:40px;
    border-width:1px;
    border-color:white;
    border-style: solid;
    border-collapse:collapse;
    background-color:#FFFFFF; 
    empty-cells:hide; 
    box-shadow: 0 0 2px 2px rgba(102, 123, 150, 0.5);
}

DIV.contentwithtopnav td    {   
        padding:10px; 
        text-align:left; 
    }

DIV.contentwithtopnav tr    {   
        padding:10px;
    }

SPAN.showbuttons {  
        float: left;
        margin-left: -5em;
        opacity:0;
    }

DIV.hoverbuttons:hover .showbuttons {
        opacity:1;
    }

SPAN.showbuttons:hover { 
        opacity:1;
    }

我想知道如何解决这个问题吗？如果您需要任何其他信息，请与我们联系。

谢谢！

具有固定高度的表格单元格以及悬停时某些按钮的显示

0 个答案: