开发者

Padding does not work in iE?

I would like to have space around the content, inside the border of the element.

http://www.w3schools.com/CSS/css_padding.asp

I have used cellpadding which is working pretty good in FF but not in IE. The version of IE that I am using is 7.0.5730.13

I have tried a simple table

<table style="padding:100px" border="1">
    <tr><td>123</td></tr>
    <tr><td>456</td></tr>
    <tr><td>678</td></tr>
    <tr><td>kuz</td></tr>
</table>

But the output does not have space at all.. If I am using padding tag at <td>. It is working good. As padding is not working in IE. I used an alternate me开发者_运维问答thod.

I have created two dummy rows; one on top, another on the bottom and dummy columns one on right another left and I styled them with padding. It is working. Please let me know if there is any better method to have space around the content.


IE does not support padding on a table. I'm guessing you want to do this to have a space between the edge of the table and the content.

You can however have the same result by putting the table in a div (this is cross-browser).

<div style="padding:100px; border: solid black 1px">
  <table border="1" style="border: solid transparent 0px; width:100%">
        <tr><td>123</td></tr>
        <tr><td>456</td></tr>
        <tr><td> 678</td></tr>
        <tr><td>kzuk</td></tr>
    </table>
</div>

The div will mimic the table's outer border.

Edit: This will only work if your table is at 100% width. You can however, restrict the width of the div, but then you'd have to know how wide you want it to be.

<div style="padding:100px; border: solid black 1px; width:300px">
  <table border="1" style="border: solid transparent 0px; width:100%">
        <tr><td>123</td></tr>
        <tr><td>456</td></tr>
        <tr><td> 678</td></tr>
        <tr><td>kzuk</td></tr>
    </table>
</div>


http://www.w3schools.com/CSS/css_table.asp
Table padding is only implemented via a cell (td)


Check that your ie is not running on quircks mode, verify that you placed these lines on top of your html:

<!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" xml:lang="en" lang="en">

They will prevent ie from loading quircks mode

Remeber, if you apply a padding to the table, like

<table style="padding: 100px">

This will leave a space between the table and its content, if you want to make space between cells and their content, is like vikrash said, or you may use cellpadding


You should use something like this:

<td style="padding: 10px">

CSS style 'Padding' should be applied to td not to table.


how about using margin to replace padding

margin: 5px 0 0 5px;
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜