如何让表格单元具有相同的高度

Question

如何让表格单元格高度相同？查看http://thomaswd.com/organizer/dashboard并单击日历.您将看到表格单元格具有不同的高度.我在桌子顶部有2排固定高度,我的桌子高度是100%.我不想要指定的像素高度,因为在调整浏览器大小时这不起作用.我该怎么做呢？

Answer 1

看起来你想要的是最高单元格的高度在整行上传播.

你可以用javascript做到这一点:

var eq_el_height = function(els, min_or_max) {

    els.each(function() {
        $(this).height('auto');
    });

    var m = $(els[0]).height();

    els.each(function() {
        var h = $(this).height();

        if (min_or_max === "max") {
            m = h > m ? h : m;
        } else {
            m = h < m ? h : m;
        }
    });

    els.each(function() {
        $(this).height(m);
    });
};

将表格单元格传递给函数,如下所示:

        $(#fixedheight tr').each(function(){
            eq_el_height($(this).find('td'), "max");
        });

Answer 2

为了使表格单元格具有相同的高度，我使用 Google Chrome 并通过右键单击某一天并选择“检查元素”来检查日历上的某一天。然后我改变了“日历日”的样式，如下所示：

/* shared */
td.calendar-day, td.calendar-day-np {  
    border-bottom:1px solid #999; 
    border-right:1px solid #999; 
    height: 10%;
}

只需在 style.css 中指定您想要的高度即可。