Grow your CSS skills. Land your dream job.

Multi-accordion help / CSS help

  • # April 3, 2010 at 7:12 pm

    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 for 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!

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".