padding-right部分在div变窄时候会被忽略
以下的测试代码，可以看到，window很宽时候，右边部分是有padding的，然后拖动浏览器把window变窄，这个过程中 padding-right越来越窄，直到padding完全消失，之后才出现横向滚动条，这时候拉动滚动条到最右边可以看到padding部分没了。
期望的效果是padding部分一直能保持那段空白，当滚动条拉到右边时候，能看到padding部分空着20px
请问咋改。
谢谢。
- JScript code
<html> <head> <body> <div> <div style='padding-right:20px; overflow-x:scroll; border: 1px solid #000000;'> <table style='width:100%;'> <tbody> <tr> <th style='min-width:200px;border:1px solid #ff0000;'>col A</th> <th style='min-width:200px;border:1px solid #00ff00;'>col B</th> <th style='min-width:200px;border:1px solid #0000ff;'>col C</th> </tr> </tbody> </table> </div> </div> </body></html>
[解决办法]
这个用padding没有办法解决 ，只能这样
- HTML code
<body> <div> <div style=" overflow-x:scroll; border: 1px solid #000000; "> <table style='width:100%;'> <tbody> <tr> <th style='min-width:200px;border:1px solid #ff0000;'>col A</th> <th style='min-width:200px;border:1px solid #00ff00;'>col B</th> <th style='min-width:200px;border:1px solid #0000ff;'>col C</th> <th width="20px;"> </th> </tr> </tbody> </table> </div> </div> </body>
[解决办法]
- HTML code
<html> <head> <body> <div> <div style='overflow-x:scroll; border: 1px solid #000000;'> <table style='width:100%;padding-right:20px;'> <tbody> <tr> <th style='min-width:200px;border:1px solid #ff0000;'>col A</th> <th style='min-width:200px;border:1px solid #00ff00;'>col B</th> <th style='min-width:200px;border:1px solid #0000ff;'>col C</th> </tr> </tbody> </table> </div> </div> </body></html>
[解决办法]
ie8下没问题