445637 - headline for blog.mozilla.com posts is partially hidden under author info

Status: VERIFIED FIXED

(mozilla.org Graveyard :: Server Operations, task)

Description

[Paul Kim]

Attachment: blog.mozilla.com bustage

See attachment. The letter "e" is covered by the gray graphic for the author info, making it look like a misspelling. Layout looks fine in Safari, busted in Firefox 3.

Comment 1

[Paul Kim]

Attachment: sidebar at bottom of layout

Comment 2

[Paul Kim]

Updating: just realized the entire sidebar is now displaying at the bottom of the page, after all posts. See second attachment.

Comment 3

[Jeremy Orem [:oremj]]

I'm not sure who the theme dev is, but the quickest way to hash this out will probably be to contact him.  If he is not available we can try to get someone from webdev to fix the css.

Comment 4

[Paul Kim]

OK - jslater, can you take this when you're back in the office?

Comment 5

[Paul Kim]

sorry, meant to just cc: jslater. reassigning to oremj so i don't break the tubes.

Comment 6

[Jeremy Orem [:oremj]]

Please reassign when the author posts a fix.

Comment 7

[John Slater]

Copying Craig Cook, the theme developer on this. Craig, as noted in my earlier email, could you take a look and see if you can find the cause of this weirdness?

Thanks!

Comment 8

[Craig Cook (:craigcook)]

The title overlap is entirely my fault. At some point during construction I widened the author byline box but didn't increase the title padding to match, and didn't catch the bug because my test posts all had short titles. But it's an easy fix. 

In /themes/MozillaBlog-fox3/style.css line 81 reads:
.hentry .entry-title { font-size: 140%; padding-right: 120px; }

Change to:
.hentry .entry-title { font-size: 140%; padding-right: 150px; }

The problem with the sidebar is caused by some code inserted in the lead post titled "Firefox 3.0.1 security and stability update now available for download" (post ID is 156). There's a bit of HTML, <div class="entry">, in the post content that shouldn't be there, and that opening tag means the next closing </div> tag throws off the rest of the document. When the browser reaches the end, it thinks a closing tag is missing thanks to that unexpected opening tag. You should be able to fix it just by editing that post and removing that opening div tag.

In the WordPress back-end, under Options > Writing, there'll be a checkbox labeled "WordPress should correct invalidly nested XHTML automatically." If that option is checked it should prevent this sort of thing from happening again (WordPress can clean up malformed HTML automatically).

The ShareThis links aren't presently working because, for some reason, the script element is being malformed when it's injected into the document's head. I can offer no logical explanation for this, except that it's possible one of the other plugins is interfering.

Comment 9

[Paul Kim]

Thanks Craig! The <div> removal fixed the sidebar issue.

oremj: can you please make the theme edit to address the overlap issue?

Comment 10

[Jeremy Orem [:oremj]]

(In reply to comment #8)
> In /themes/MozillaBlog-fox3/style.css line 81 reads:
> .hentry .entry-title { font-size: 140%; padding-right: 120px; }
> 
> Change to:
> .hentry .entry-title { font-size: 140%; padding-right: 150px; }
> 

Fixed.

Comment 11

[Jeremy Orem [:oremj]]

ShareThis is now working as well.

Comment 12

[Stephen Donner [:stephend] Not actively reading bugmail]

Verified FIXED; all three issues are now working for me.