padding-right部分在div变窄时候会被忽略,该如何解决 _HTML/CSS

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;">&nbsp;</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下没问题