Issue metadata
Sign in to add a comment
|
Rendering CSS incorrectly after hovering over the drop-down box
Reported by
yuanqing...@gmail.com,
Jul 3
|
||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36 Steps to reproduce the problem: 1. Unzip the attchment and use chrome to open the HTML page that is named 'Fluid Style Tester Components.html'. 2. Resize the window by drag&drop chrome window's left border quickly. It will show as the snapshot 'chrome67_before_over.JPG'. 3. Move mouse over the drop down box that is named 'Modeless Type'. Please refer to snapshot 'chrome67_after_over.JPG', you can find controls do not align. What is the expected behavior? The rendered controls of page should keep align. What went wrong? The rendered controls of page do not align after mouse hover. Did this work before? Yes 50.0.2661.75 Chrome version: 67.0.3396.99 Channel: stable OS Version: 6.1 (Windows 7, Windows Server 2008 R2) Flash Version:
,
Jul 4
,
Jul 4
Unable to reproduce the issue on chrome reported version# 67.0.3396.99 using Windows-7 with steps mentioned below: 1) Launched chrome reported version and opened the html file provided in comment# 0 2) Resized chrome window by drag & drop window's left border quickly and hovered mouse over 'Modeless Type' dropdown 3) Didn't observed any change in alignment after mouse hover. @Reporter: Please find the attached screencast for your reference and let us know if we missed anything in reproducing the issue, provide your feedback on it which help in further triaging it. Thanks!
,
Jul 5
Hi Team,
Thank for your patience training. I upload two videos for difference cases. Please refer to the videos to reproduce this issue. If you need any other information that can help you analize this issue, please let me know it.
,
Jul 5
Thank you for providing more feedback. Adding the requester to the cc list. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Jul 5
Hi Team, These snapshots are the result of tests from other versions.
,
Jul 6
Unable to reproduce the issue on reported chrome version 67.0.3396.99, on M-60(60.0.3072.0) and the latest Canary 69.0.3482.0 on Windows 10 by following below steps. 1. Opened the HTML page 'Fluid Style Tester Components.html'. 2. Resized the window by drag&dropped chrome window's left border quickly and moved mouse over the drop down box which is named as 'Modeless Type'. 3. Didn't observe any change in alignment after mouse hover. Attached screencast for reference. @Reporter : Could you please confirm whether the issue is about green button alignment which is shown in the last part of screencast, so that we can proceed with further traiging. Thanks!
,
Jul 8
Hi Team, Thank for your response. I watch the video that you upload. I think I know why you can not reproduce this issue. Please compare with your video and my videos. You can find your drag&drop speed is too slow. You should move the left border and drop the mouse quickly to reproduce this issue. Please enlarge the chrome window to a large enough width(for example, make the window width to 1440px), then drag the left border to decrease the window width quickly. When you see the horizontal gray bars (The bars that under the label 'Static Controls' and 'Actionable COntrols') are covered by the window right border (You did it at 0:09 in your video), then drop the mouse immediately. The first issue should be reproduced. Normally, there is padding between the horizontal gray bars and the right window border. But when this issue happen, there is no padding between the horizontal gray bars and the right window border. If you move your mouse over the drop box that is named 'Modelness Type', you will find there is padding at the end of the horizontal gray bar that is below the label 'Actionable Controls' only. This is second issue.
,
Jul 8
Thank you for providing more feedback. Adding the requester to the cc list. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Jul 9
@swarnasree,
Yes, the alignment of the green button is part of the problem. I don't know why, but I think the major reason is due to there is no padding between the gray horizontal bars and the right border after we resize the chrome window quickly(Please refer to 'Expect_And_Incorrectness_01.jpg'). The green button misalignment problem is clause by Chrome will dynamiclly add a padding at the end of the gray horizontal bar after I move mouse over the drop-down control, the gray horizontal bar is under the 'Actionable Label' label (Please refer to After_Mouse_Over_Drop-Down.jpg).
,
Jul 9
Able to reproduce the issue on reported chrome version 67.0.3396.99, on M-60(60.0.3072.0) and the latest Canary 69.0.3482.0 on Windows 10 by following below steps. 1. Opened the HTML page 'Fluid Style Tester Components.html'. 2. Resized the window by drag&dropped chrome window's left border quickly and moved mouse over the drop down box which is named as 'Modeless Type'. 3. Observe change in alignment after mouse hover. As per comment#11, there is problem in alignment of green button also. Attached screencast for reference. Hence, marking it as untriaged to get more inputs from dev team. Thanks!
,
Jul 12
Hi Team,
Is there any progress?
,
Nov 26
** UI Mass triage ** Still able to reproduce the issue on OS-win using chrome latest canary #72.0.3621.0, hence adding respective labels. Thanks...!! |
|||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||
Comment 1 by yuanqing...@gmail.com
, Jul 3