html bottom没有效果,HTML CSS Padding-bottom 0在firefox上不起作用

您已经为浏览器提供了不完整的布局问题。您有一个三乘三的网格，其列或行都没有固定的大小。所以问题是你最终得到的第一行比你预期的要高，因为浏览器试图在第一列的单元格中分配第二列中的rowspan引起的“备用”高度。

这没有标准化的算法;浏览器做不同的事情，通常包括不愉快的事情，比如查看每个单元格中标记的原始字节数。您不想依赖此行为。它还会减慢页面渲染速度，并且当内容非常少或大量时，可能会产生非常奇怪的页面扭曲效果。如果需要使用表格进行布局，请确保对固定大小的列使用具有显式宽度的table-layout: fixed，并在存在行扫描时为单元格设置显式高度，以避免歧义。

但是，rowspan / colspan的泛滥通常暗示你应该看一种不同的布局形式。这个例子使用CSS更容易实现。例如。：

...

...

...

...options...

...

...fields...

...

风格如下：

#ads { position: absolute; right: 0; width: 160px; }

#content { margin-right: 160px; }

#video { float: right; width: 440px; }

#poll, #subscribe { margin: 0 440px 0 0; }

#about { clear: right; }

我还建议您将JavaScript逻辑从您当前拥有的内联事件处理程序属性移到单独的JavaScript块(嵌入式

即。

οnsubmit="

var inputs = this.getElementsByTagName('input');

var checkedValue;

for(var i = 0; i < inputs.length; i++)

{

if(inputs[i].getAttribute('type') == 'radio' && inputs[i].checked)

{

checkedValue = inputs[i].value;

}

}

/*makeAjaxPostRequest('/poll/ajax-vote.php', 'vote='+checkedValue, processAjaxResponse);*/

makeAjaxGetRequest('/poll/ajax-vote.php?vote='+checkedValue, processAjaxResponse);

return false;"

代替：

document.getElementById('pollForm').οnsubmit= function() {

var checkedValue= getRadioValue(this.elements.vote);

makeAjaxPostRequest('/poll/ajax-vote.php', 'vote='+encodeURIComponent(checkedValue), processAjaxResponse);

return false;

};

function getRadioValue(fields) {

for (var i= fields.length; i-->0;)

if (fields[i].checked)

return fields.value;

return '';

};

始终只允许对积极表单执行积极的POST请求。创建查询字符串时始终使用encodeURIComponent。不要使用getAttribute，因为它在IE中不起作用;例如，使用直接DOM Level 1 HTML属性。 input.type。