763035 - Blog's Sidebar No Longer Displays Correctly in Latest Version of Firefox

Status: RESOLVED DUPLICATE of bug 478834

(Core :: Layout: Tables, defect)

Description

[Melissa Cleaver]

Attachment: Screenshot.jpg

User Agent: Mozilla/5.0 (Windows NT 6.0) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.52 Safari/536.5

Steps to reproduce:

Last night, my blog was displaying just fine as it is in both Chrome and IE.  But this morning after Firefox automatically updated to the latest version, my blog's sidebar is all messed up and is not displaying correctly anymore. 


Actual results:

My blog's sidebar is showing up either on top of my posts or behind them, which is incorrect.  It seems that everywhere where tables are used in my sidebar is now completely off.  


Expected results:

It should be aligned to the left, but this no longer happens in the newest version.  In the FF version last night, everything was fine and continues to display correctly in both IE and Chrome.

Comment 1

[Boris Zbarsky [:bzbarsky]]

Melissa, I'm seeing the same rendering here in Firefox 13, Firefox 12, Firefox 4, and Firefox 3.6.  At least if we're talking about the "Welcome to the zoo! ..." text being missing.

What version of Firefox were you using before?  Or are you talking about a different problem?  The missing text is the main difference I see between Firefox and Chrome here.

Comment 2

[Melissa Cleaver]

Yes, that's right.  It seems that anything in a table in my sidebar isn't displaying properly now.  But I've been using this same sidebar for years and I've been using Firefox for years too and I've never had this happen before.  I'm not sure what version I was using yesterday, but the problem wasn't there then.  

Any ideas on how I can fix this?

Comment 3

[Boris Zbarsky [:bzbarsky]]

Still trying to figure that out.  At first glance it looks like the table for some reason decides it needs to be all the way over on the right and very thin.  _Usually_ that would happen if there were a float to its left, but I'm not seeing one there yet.

Do you have any idea whether something might have changed in your stylesheets and markup?  Again, I see the same exact behavior with every Firefox version I've tried...

Comment 4

[Melissa Cleaver]

Not that I know of.  It's not that the table is thin.  It's full size, just shifted badly to the right.  My blog posts are on top of them which is why they appear thin...that's just the part you can see that's sticking out from the margin.

Is there any specific code I could put in my CSS that would be just for Firefox?  Something like -moz-margin-right: 300px;

I don't know if that would work or not, but it just appears that all of my table elements have shifted right completely out of the sidebar container.  Thanks for checking into this for me.

Comment 5

[Boris Zbarsky [:bzbarsky]]

Ah, so it's possible that this is font-size dependent, which is why I always see it and you only sometimes do.

What I see over here is that the ".rightnav h2" styles include a "float: left".  The container it's in is a fixed height, and the h2 actually overflows it slightly vertically.  Then it ends up vertically next to the table and that table is shifted right to avoid the float, etc.

Long story short, doing ".rightnav .tetwidget { clear: both; }" in your stylesheet should, I think, make it all happy.

Comment 6

[Boris Zbarsky [:bzbarsky]]

Er, make that ".rightnav .textwidget { clear: both; }".  ;)

Comment 7

[Melissa Cleaver]

YAY!  That was it!  Thank you, thank you, thank you!  I SO appreciate your help!  :)

Comment 8

[Boris Zbarsky [:bzbarsky]]

You're welcome.  :)

On our end, this table-next-to-float issue is bug 478834.