Problem mit Accordion

Hallo c:
ich hab da ein kleines Problem und zwar habe ich von einem anderen forum (leider ist der thread wo ich den code herhab irgendwie gelöscht worden desshalb kann ich kein link senden >.<) und naja ich kenn mich zwar einiger maßen mit html, css und co aus allerdings find ich den fehler einfach nicht xD das problem ist folgendes:
http://noragami-sekai.forumieren.com/t1-ihr-erstes-thema#2 (letzter beitrag) also es erfüllt zwar seinen zweck und fährt brav aus und zeigt den text allerdings möchte ich das alle balken gleich groß sind egal welcher tab gerade offen ist. ich hoffe mir kann jemand helfen q.q

Javascript:

Code:

$(document).ready(function(){
 
    activeItem = $("#accordion li:first");
    $(activeItem).addClass('active');
 
    $("#accordion li").hover(function(){
        $(activeItem).animate({width: "50px"}, {duration:300, queue:false});
        $(this).animate({width: "600px"}, {duration:300, queue:false});
        activeItem = this;
    });
 
});

CSS

Code:

#accordion {list-style: none;margin: 5px 0;padding: 0;height: 400px;overflow: hidden;background: #000000;width: 750px;}
#accordion li {float: left;border-left:0px;
  display: block;height: 400px;width: 50px;padding: 5px 0;overflow: hidden;text-decoration: none;font-size: 12px; line-height: 1.5em;}
#accordion li img {border: none;float: left;margin: -5px 5px 0 0;border-radius: 5px;-cr-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;transition: all 0.4s ease-in-out 1s;}
#accordion li.active {width: 600px;}

HTML

Code:

<ul id="accordion">
                                                 
  <li>
                            <img src="http://oi61.tinypic.com/jqszcy.jpg" />ÜBERSCHRIFT HIER <br />     Text                                                  
  </li>
                                                 
  <li>
                            <img src="http://oi60.tinypic.com/taq7iw.jpg" />ÜBERSCHRIFT HIER <br />     Text                                                    
  </li>
                                                 
  <li>
                            <img src="http://oi60.tinypic.com/2v005t0.jpg" />
     <table>
        <tbody>
           <tr>
              <td>
                TEXT
              </td>
              <td>
              TEXT
              </td>
           </tr>
        </tbody>
     </table>
                         
  </li>
                                         
  <li>
                        <img src="http://oi62.tinypic.com/30satzd.jpg" />ÜBERSCHRIFT HIER <br />     Text                                                      
  </li>
</ul>

Hallo Yuzuki

ich werde dir sagen wo das Problem zu finden ist. In deinem Code sind viele Zeilenumbrüche und Leerstellen enthalten. Und damit sind nicht die br Tags gemeint.
Wenn du HTML in den Beiträgen benutzt, empfiehlt es sich den Code ohne solche Freiräume, komplett aneinander zu schreiben und Zeilenumbrüche mit dem br Tag einzufügen. Dann kann es beim geposteten Beitrag nicht zu solchen Fehlern kommen. Dort werden nämlich alle Freiräume in das HTML Gerüst integriert, was zu seltsamen Abständen im fertigen Beitrag führt.
Versuch mal den Code so zu posten:

Code:

<ul id="accordion"><li><img src="http://oi61.tinypic.com/jqszcy.jpg" />ÜBERSCHRIFT HIER <br />Text</li><li><img src="http://oi60.tinypic.com/taq7iw.jpg" />ÜBERSCHRIFT HIER<br />Text</li><li><img src="http://oi60.tinypic.com/2v005t0.jpg" /><table><tbody><tr><td>TEXT</td><td>TEXT</td></tr></tbody></table></li><li><img src="http://oi62.tinypic.com/30satzd.jpg" />ÜBERSCHRIFT HIER <br />Text</li></ul>

Liebe Grüße
Gunich

---

EDIT:

Keine Rückmeldung mehr erhalten, das Problem scheint gelöst zu sein. Deshalb wurde hier geschlossen. Sollte es noch Bedarf zu diesem Thema geben, dann bitte eine PN an den unten stehenden EDIT-Absender senden.