当我在浏览器Chrome上缩小很远时,info_table会向下移动。为什么这样做呢?同样,将overflow: auto;添加到section时,它也会移动。我能做什么?

Jsfiddle http://jsfiddle.net/PbwS8/3/

的CSS

*{
    font-size:100%;
    margin: 0px;
    padding: 0px;
}

body{
    width: 100%;
}

#info_table{
    float: left;
    width: 480px;
    margin: 40px 0px 0px 16px;
    border-spacing: 0px 0px;
}

#left{
    float:left;
    margin: 60px 0px;
}

#photo{
    float: left;
    width: 176px;
    height: 176px;
    border: 1px solid black;
}

#section{
    margin: 160px auto 0px;
    width: 675.2px;
    height: 320px;
    #overflow: auto;
    #border:1px solid black;
}

#choosephoto{
    width: 64px;
}

#submitwords{
    width: 72px;
    height: 28px;
    margin-left: 104px;
    #border:1px solid purple;
}


#wrapper{
    display: block;
    box-shadow: 3px 10px 5px #888888;
    margin: 0px auto;
    margin-top: 48px;
    width: 1024px;
    height: 960px;
    overflow: auto;
    background:white;
}


的HTML

 <div id="section">
            <body>
            </body>
            <form>
                <div id="left">
                    <div id="photo">

                    </div>
                    <br/>
                    <input type="file" id="choosephoto" name="uploadphoto"/>
                </div>
                <table id="info_table">
                    <tr>
                        <td>Name:</td>
                    </tr>
                    <tr>
                        <td><input/></td>
                    </tr>
                    <tr>
                        <td>Info:</td>
                    </tr>
                    <tr>
                        <td><textarea></textarea></td>
                    </tr>
                    <tr>
                        <td><button type="submit" id="submitwords">Update</button></td>
                    </tr>
                </table>
            </form>
        </div>

最佳答案

至于发生了什么:似乎浏览器正在通过更改#photo上边框的宽度来补偿缩放级别。

67%缩放:



50%缩放:



至于如何解决呢?除非非常需要能够进行这样的缩放,否则我不会担心,因为要确保正确缩放所有缩放比例,需要进行很多工作。

关于html - 为什么浏览器缩小时div会移动?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/17177988/

10-12 13:10
查看更多