I just ran into this bug at Fidelity's website (Mozilla's retirement 401k account provider). STR there: (1) Sign in at https://nb.fidelity.com/public/nb/401k/home (2) Choose an employer account (in my case, I click "Mozilla") This takes me to a dashboard with some header-tabs near the top, saying `Summary | Contributions | Investments` etc. (3) Right-click the "Summary" text on that header-tab section of the page (to give it focus without actually activating its link) ACTUAL RESULTS: There's a few-pixel layout adjustment in that whole header-tab area -- it all gets a little shorter or shifts upwards, which means all of the other header-tabs ("Contributions | Investments", etc) shift upwards a bit. EXPECTED RESULTS: No such layout adjustment; the container shouldn't change size and the other tabs shouldn't move. Chrome dev-edition 96 gives EXPECTED RESULTS; Firefox Nightly 95 gives ACTUAL RESULTS At Fidelity's website, tTis is because of a `:focus`-triggered CSS rule which adjusts the `padding` on the "Summary" link; and the link happens to have `vertical-align:middle`, so this `:focus` styling ends up triggering a version of this bug and changing the size of the container. (Similarly: in the testcases here, if you remove or change the padding on the `vertical-align:middle` thing, then it changes the size of the container in Firefox, but not in Chrome.)
Bug 1436801 Comment 6 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
I just ran into this bug at Fidelity's website (Mozilla's retirement 401k account provider, in the US) STR there: (1) Sign in at https://nb.fidelity.com/public/nb/401k/home (2) Choose an employer account (in my case, I click "Mozilla") This takes me to a dashboard with some header-tabs near the top, saying `Summary | Contributions | Investments` etc. (3) Right-click the "Summary" text on that header-tab section of the page (to give it focus without actually activating its link) ACTUAL RESULTS: There's a few-pixel layout adjustment in that whole header-tab area -- it all gets a little shorter or shifts upwards, which means all of the other header-tabs ("Contributions | Investments", etc) shift upwards a bit. EXPECTED RESULTS: No such layout adjustment; the container shouldn't change size and the other tabs shouldn't move. Chrome dev-edition 96 gives EXPECTED RESULTS; Firefox Nightly 95 gives ACTUAL RESULTS At Fidelity's website, tTis is because of a `:focus`-triggered CSS rule which adjusts the `padding` on the "Summary" link; and the link happens to have `vertical-align:middle`, so this `:focus` styling ends up triggering a version of this bug and changing the size of the container. (Similarly: in the testcases here, if you remove or change the padding on the `vertical-align:middle` thing, then it changes the size of the container in Firefox, but not in Chrome.)
I just ran into this bug at Fidelity's website (Mozilla's retirement 401k account provider, in the US) STR there: (1) Sign in at https://nb.fidelity.com/public/nb/401k/home (2) Choose an employer account (in my case, I click "Mozilla") This takes me to a dashboard with some header-tabs near the top, saying `Summary | Contributions | Investments` etc. (3) Right-click the "Summary" text on that header-tab section of the page (to give it focus without actually activating its link) ACTUAL RESULTS: There's a few-pixel layout adjustment in that whole header-tab area -- it all gets a little shorter or shifts upwards, which means all of the other header-tabs ("Contributions | Investments", etc) shift upwards a bit. EXPECTED RESULTS: No such layout adjustment; the container shouldn't change size and the other tabs shouldn't move. Chrome dev-edition 96 gives EXPECTED RESULTS; Firefox Nightly 95 gives ACTUAL RESULTS At Fidelity's website, this is because of a `:focus`-triggered CSS rule which adjusts the `padding` on the "Summary" link; and the link happens to have `vertical-align:middle`, so this `:focus` styling ends up triggering a version of this bug and changing the size of the container. (Similarly: in the testcases here, if you remove or change the padding on the `vertical-align:middle` thing, then it changes the size of the container in Firefox, but not in Chrome.)