最大宽度不工作表的IE7 [英] Max-Width not working on Table for IE7

查看:104
本文介绍了最大宽度不工作表的IE7的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

那么,为什么max-width在Internet Explorer 7中的表上不起作用?最大宽度可用于其他元素,似乎工作正常,但是当应用于表,我不能使它做任何事情,即最大宽度规则被忽略。下面是代码:

So why does "max-width" not work on Tables in Internet Explorer 7? Max-width is available on other elements, and seems to work fine, but when applies to a table, I can't make it do anything, ie the Max-Width rule is simply ignored. Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Foo</title>
</head>
<body>
    <div style="background-color: Red; max-width: 1000px;">
        <table style="background-color: Green; max-width: 500px;">

                <tr>
                    <td><a href="#" class="action view">View</a></td>
                    <td>7/20/2011</td>
                    <td>James Smith</td>
                    <td>345 NW 23rd Ave Gainesville, FL 32606</td>
                    <td>Alachua Blah blah sf jfh jsdhjs fjsh djkf sdjkhk</td>
                    <td>345621</td>
                    <td>Fred Smith</td>
                </tr>
        </table>
    </div>
</body>
</html>

在Firefox中,表格被正确地约束为500px,并且单元格中的文本以适当的方式(在单词之间,就像你所期望的)。在IE7中,它像无包装规则已经应用。每个单元伸展到它所需要的,而不试图破坏与单元格的文本,整个表只是伸出来忽略最大宽度规则。

In Firefox, the table is properly constrained to 500px, and the text inside the cells breaks in appropriate ways (between words, just like you'd expect). In IE7 however, its like the "no-wrap" rule has been applied. Each cell stretches out to its needed with, without trying to break text withing the cell, and the whole table simply stretches out to ignore the max-width rule.

与这个垃圾?如何在IE7中的表格上放置最大宽度? (它在FF& IE8中正常工作)

What up with this crap? How do I put Max-Width on a table in IE7? (It works fine in FF & IE8)

我试过的不起作用:

table {display:block; }

table { display: block; }

td {word-wrap:break-word; }

td { word-wrap: break-word; }

table {table-layout:fixed; }

table { table-layout: fixed; }

推荐答案

WebKit浏览器会忽略表格的max-width属性集,Chrome和Safari都会忽略表格最大宽度为IE7。我建议将max-width属性设置为包装元素,例如 div

The max-width property set for a table is ignored by WebKit browsers, both Chrome and Safari will render the table ignoring the max width as does IE7. I would recommend setting the max-width property to a wrapper element such as a div.

请参阅 http://jsfiddle.net/P5YPR/1/

这篇关于最大宽度不工作表的IE7的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆