Multi-accordion help (CSS issue maybe?)

So, I've been trying to develop this multi-accordion news section for this site. It's actually all working, thanks to an insightful plugin. I've modified it a little bit so it works as I want it to, but I've run into two issues, one which is possibly CSS.

Issue #1:

The idea f开发者_运维百科or the user is that when they view this page, they see all the recent headlines. They can also see who it has been posted by and how many comments have been made to this article. If they wish, they can then click on the headline and the field will expand into the article. They can then either make a comment or view the comments via clicking the View Comments link or clicking the "number of comments" link in the "Posted by..." area (a shortcut to the comments basically).

The problem I'm having is if I make the AUTHOR or the "0" comments a link, it breaks the accordion because the accordion uses an A CLASS to open it up. I'm looking for a fix, I've tried making it a H1 or a DIV but that also breaks it.

Issue #2:

This is a pretty picky one, but when you click the headline it expands, but at least in Firefox (haven't tested it in Chrome yet) the text jumps from the right and to the left, locking in place from which the CSS tells it to (padding-left). I don't know why it's exactly doing that, if anyone has any insight on that, it'd be appreciated.

A two-parter to this issue is when you open the Headline to the article and then decide to close the article by clicking on the Headline, parts of the accordion jumps from the darker purple to the light purple before the task is finished. I'm also interested fixing this, but this issue in its entirety are all pretty nit picky things.

You can view the demo of the site here: http://www.notedls.com/demo

Please if anyone has any advice or fixes, I'd appreciate it, I've been trying to get this all to work to the best of my ability, but I'm clearly no guru or expert. Thanks!

For issue #2 I think if you set a width to that div then it would not keep scooting around. Now you are just setting a display:block with no width and that expands as the accordion opens and pushes past the thumbnail. You also have padding-left: 65px set to that div and it is starting the padding to the left of the thumb but as it expands it sets that padding from the far left of that block. You could set a long bottom margin to your thumb or just remove that padding and allow the text to wrap it.

Issue #1 I dont really see the problem of it "breaking" the accordion. When I click on the comments link it just expands it as I would expect it to..