Bug 51737 - Unwanted spacing is added on modifying width of a nested DIV with specific style settings
Summary: Unwanted spacing is added on modifying width of a nested DIV with specific st...
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: PC Windows 7
: P2 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2010-12-30 02:00 PST by John
Modified: 2022-12-09 08:43 PST (History)
3 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description John 2010-12-30 02:00:01 PST
It's reproduced in Safari 5.0.2 and Chrome 8.0.552.224

Run the following HTML snippet:

<div style="float: left; border: solid 1px red">
    <div style="overflow-x: hidden; overflow-y: scroll;" id="div1">
        test
    </div>    
</div>
<input type="button" value="click me" onclick="document.getElementById('div1').style.width = '50px'" />


Click the "click me" button.
You'll see an extra spacing added to the right of scrollbar.
Comment 1 Gurpreet 2014-05-16 02:44:19 PDT
All the browsers show same behaviour. Doesnot seem to be a bug. Please confirm what behaviour you are expecting.
Comment 2 Ahmad Saleem 2022-12-09 04:57:47 PST
I am not able to reproduce original issue in Safari 16.1 and STP 159 while I do see the the spacing between red border container and button is larger than other browser (Chrome Canary 110 and Firefox Nightly 109), which might be just cosmetic theming difference and not something substantial.

JSFiddle - https://jsfiddle.net/dgcmoy7a/show

Just going to comment and add others to comment and confirm my testing. Thanks!
Comment 3 Alexey Proskuryakov 2022-12-09 08:43:54 PST
One needs to change macOS system preferences to always show scrollbars to follow the steps to reproduce. But even so, there is no extra spacing added in Safari or other macOS browsers. Didn't attempt to verify on Windows though.