Community
Participate
Working Groups
Created attachment 190716 [details] snapshot of problem The "new look" with the orion sphere overlaying the dark toolbar is achieved through some table (!?!) layout. In trying a bunch of different layout choices, this was the only reliable way to stretch the toolbar over the width of the page, and ensure bottom/right alignment. (you can't mix CSS float with absolute positioning). This works well on FF and Chrome, but there are extra pixels in IE that cause a vertical scrollbar to appear in the banner. It appears as if there are about 4 extra pixels on the bottom of each row in the table that do not appear in the other browsers. The screenshot shows the banner when scrolled to the top and also when scrolled to the bottom. (The green is a debugging color I'm using to see the dom sizes). Searching around on this issue reveals that the IE difference is "usually" because there is an embedded blank text node somewhere in the table and IE generates space around the content for this. It could also be a different css default, but I've tried all kinds of CSS changes to no avail.
the pixels are appearing in chrome now also. They were not there last night when I first noticed this. I think that as I've increased content in the lower bar this has been introduced.
I removed all content from the table columns and the problem persists, so it's something with the table/tr/td styling (padding, borders, etc.) rather than something introduced by the content in the tds.
Created attachment 190720 [details] screenshot fixed the problem on chrome, which was introduced when I added a generous padding-top to the top left and right toolbars. This forced the tablerow to be too large. The IE problem persists. The snapshot shows that there are three extra pixels introduced at the bottom of the table. This causes the scrolling.
Fixed. For the life of me I don't know where those extra pixels are coming from, but I verified they are appended to the bottom of the table, rather than caused by changing the spread of the two toolbars. So...the workaround is to change the CSS in the toolbar to overflow: hidden so that the mystery pixels are clipped.
