User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1b2) Gecko/20060818 BonEcho/2.0b2 Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1b2) Gecko/20060818 BonEcho/2.0b2 The All Tabs menu looks to be wider during overflow than when there is no overflow. This also probably leads to the dropmarker not being centered during overflow. Reproducible: Always

Added an attachment to show: 1. Different size of the All Tabs menu during normal state and overflow state (wider) 2. Dropmarker not centered during overflow state (probably because of widening of All Tabs Menu)

Request to Block Fx2

I like the idea of making the alltabs button the same width when overflowed and when not overflowed. (since this has blocking already, I guess that means mconnor and beltzner agree?)

about https://bugzilla.mozilla.org/attachment.cgi?id=235144&action=view, this screen shot shows a related problem. when in overflow, we have a 2px separation (from "-moz-margin-end: 2px;" on the .scrollbutton-up in scrollbox.css) between the "up" button (or "left" button, in LTR) and the first tab. but, when in overlow, we don't have this same 2px separation between the "down" button (or "right" button, in LTR) and the last tab. what we do have is an 20 px image alltabs-box-end-bkgnd.png, with 2px separation "built in: to the image, but when in overflow, and the scroll buttons appear, there is no built in separation, so the bug in that screen shot appears. the fix for that issue is to: 1) add class="scrollbutton-down-stack" to the stack that contains the "down" button. (remember that for tab browser, it's a stack, so that we can animate it.) 2) use css to get the 2px separation .scrollbutton-down-stack { -moz-margin-start: 2px !important; } 3) remove the "built in" 2px from alltabs-box-end-bkgnd.png, leaving us with a 18px wide version. note, 18px is the desired width for the all tabs button, as that's the same width as the scroll up and down buttons. now, to fix the original bug, about the all tabs button being wider during overflow, I had to fix the css to specify 18px (instead of 20 px) for the all tabs elements, and fix the alltabs-* images to be 18 px (instead of 20 px) combined, the patch fixes the original bug. I'll attach as screen shot that show how overflow (and not overflow) line up properly.

pinstripe will also need some similar cleanup, as it has the "need separation between the last tab and the 'scroll down' button") issue. on pinstripe, the size of the all tabs box is consistent 16 px. That's smaller (by 2 or 3 px) than the scroll buttons, but it doesn't changed width between overflow and non-overflow. having it be smaller (on pinstripe) may be by design, I'll check with jay / mconnor.

(In reply to comment #8) > Created an attachment (id=235146) [edit] > screen shot after the fix, red lines added to show everything lines up > Seth, as per this screenshot (if this is after you have applied the patch), while the width issue looks to be fixed, the dropmarker still don't seem to be centered on the AllTabs menu, it needs a small shift to the left.

>the dropmarker still don't seem to be centered on the AllTabs menu, it needs a >small shift to the left. I personally believe it should be centered over the scrollbar chevron. That would look much better IMO. ~B

in response to: > Seth, as per this screenshot (if this is after you have applied the patch), > while the width issue looks to be fixed, the dropmarker still don't seem to be > centered on the AllTabs menu, it needs a small shift to the left. and: > I personally believe it should be centered over the scrollbar chevron. That > would look much better IMO. overriding the -moz-margin-end: 5px;" (from http://lxr.mozilla.org/mozilla1.8/source/toolkit/themes/winstripe/global/toolbarbutton.css#59) for this particular element will solve both issues. updated patch (and updated screen shot) coming...

update: bug #348934 implies the reverse of what I've done (for part of this patch). instead of adding space to the right hand side, i should have removed it from the left. updated patch coming.

(In reply to comment #19) > Created an attachment (id=235209) [edit] > no gap, left or right, on winstripe > Looks much cleaner and better now. Ready to land I guess!

>on pinstripe, the size of the all tabs box is consistent 16 px. That's smaller >(by 2 or 3 px) than the scroll buttons, but it doesn't changed width between >overflow and non-overflow. > >having it be smaller (on pinstripe) may be by design, I'll check with jay / >mconnor. I'm going to make the width of the all tabs button on pinstripe be the same width as the scroll buttons on pinstripe, which is 19 px. (I'll double check with mconnor/beltzner though.)

> I'm going to make the width of the all tabs button on pinstripe be the same > width as the scroll buttons on pinstripe, which is 19 px. > > (I'll double check with mconnor/beltzner though.) mconnor/beltzner agree that making scrollbuttons and alltabs both be 19px on pinstripe is the way to go. I'll attach a separate patch for that, which will include some changes to images.

> I'm going to make the width of the all tabs button on pinstripe be the same > width as the scroll buttons on pinstripe, which is 19 px. Actually, I'm going to make everything 18 px wide (scrollbar buttons and alltabs button) on both winstripe and pinstripe, and fix the images accordingly.

Comment on attachment 235207 [details] [diff] [review] updated patch, includes fix for bug #348934 r+a=me for this mostly-theme fix. The only non-theme change is just adding a class for themes to use, which is absolutely safe and should not carry any risk.

note, winstripe had the "wider during overflow" problem. pinstripe was ok (as far as that issue goes.) the change to center the drop marker was for both pinstripe and winstripe.