I took the easy way out of making this theme by using the code “position:absolute;” to just easily move over the whole div code containing the meta data on the mp3 and the caption, so that when the post exceeded 235 pixels, it would overlap onto the tags and date info and kept on going until the caption stopped. Thanks to hopefully-someday for bringing it to my attention, I went back and added the proper coding by making sure posts aligned just like how the answer posts align with length issues.

Updates submitted to the Tumblr Theme Garden usually take about a week and you will need to reinstall the theme, but if you simply cannot wait, and you feel up to the challenge of finding your own way through my messy, unorganized code, feel free to replace the following codes.

First off, you’re going to need to replace a section of the actual audio post HTML. Find the “{block:Audio}” post in the Theme tab. Hint: use CTRL+F / Command+F to find this easily.

Make sure you’re looking at:

  {block:Audio}
  <div class="post audio">
  ...
  </div>
  {/block:Audio}

If you are, then select the entire post, all the way up until “{/block:Audio}” (yes, there is a difference) and replace that with:

  {block:Audio}
  <div class="post audio">
    <div class="permalink"><a href="{Permalink}">{text:Link Divider}</a></div>
    <div class="audioinfo">
      <div class="overlapfix">
        {block:AlbumArt}
        <div class="albumart">
        <img src="{AlbumArtURL}" />
        </div>
        {/block:AlbumArt}
        <div class="media"><p>{block:IfAudioPlayerBlack}{AudioPlayerBlack}{/block:IfAudioPlayerBlack}{block:IfNotAudioPlayerBlack}{AudioPlayerWhite}{/block:IfNotAudioPlayerBlack}</p></div>
      </div>
      {block:IfAudioInformation}
      <div class="information">
      {block:TrackName}"{TrackName}"{/block:TrackName}
      {block:Artist}<br />{Artist}{/block:Artist}
      {block:Album}<br /><span class="album">/ via {Album}</span>{/block:Album}
        <div class="otherinfo">
        {PlayCountWithLabel}{block:ExternalAudio} {text:Link Divider} <a href="{ExternalAudioURL}">Download</a>{/block:ExternalAudio}
        </div>
        {block:IfDoNotShowMediaCaption}{block:PermalinkPage}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}{/block:IfDoNotShowMediaCaption}
        {block:IfNotDoNotShowMediaCaption}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:IfNotDoNotShowMediaCaption}
      </div>
      {/block:IfAudioInformation}
    </div>
    <div class="blockif">
    {block:IfDates}{block:Date}Posted on <a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}">{Month} {DayOfMonth}{DayOfMonthSuffix}</a>, {Year} at <a href="{Permalink}">{12Hour}:{Minutes} {CapitalAmPm}</a>{/block:Date}{/block:IfDates}
    {block:IfNotes}{block:NoteCount}<br />This post has {NoteCountWithLabel}{/block:NoteCount}{/block:IfNotes}
    {block:IfTags}{block:HasTags}<br />Tags{block:Tags} {text:Link Divider} <a href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}{/block:IfTags}
    {block:ContentSource}
    <br /><a href="{SourceURL}">
      {lang:Source}:
      {block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
      {block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}
    </a>
    {/block:ContentSource}
    {block:RebloggedFrom}
    <br />Reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>
    {/block:RebloggedFrom}
    </div>
    {block:IfShowPostNotes}{block:PostNotes}
    <div class="postnotes">
    {PostNotes}
    </div>
    {/block:PostNotes}{/block:IfShowPostNotes}
  </div>
  {/block:Audio}

Afer you do this, you’re going to need to locate the audio posts’ styling code that is now incorrect for a few changes, so you’re going to need to find the code that begins with “#posts div.audio div…” (it should be located right under “#posts div.chat div.conversation span.label…”) and select that line and everything under until you get to “#posts div.answer div.question…” and replace the CSS with this new code:

#posts div.audio div.audioinfo div.overlapfix {width:207px; display:-moz-inline-stack, -webkit-inline-stack; display:inline-block; vertical-align:top; *display:inline; position:relative;}
#posts div.audio div.audioinfo div.overlapfix div.albumart img {width:207px; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;}
#posts div.audio div.audioinfo div.information {font-size:16px; margin-left:8px; width:268px; padding-left:12px; padding-top:5px; padding-bottom:5px; border-left:1px solid; border-color:{color:Title}; display:-moz-inline-stack, -webkit-inline-stack; display:inline-block; vertical-align:top; *display:inline; position:relative;}
#posts div.audio div.audioinfo div.information span.album {font-size:12px;}
#posts div.audio div.audioinfo div.information div.otherinfo {padding-top:5px; margin-top:5px; border-top:1px solid; border-color:{color:Title}; font-size:12px; text-align:center;}
#posts div.audio div.audioinfo div.information div.caption {text-align:left; padding-top:5px; margin-top:5px; border-top:1px solid; border-color:{color:Title}; font-size:12px; margin-left:0px; width:268px;}

And that’s all that you have to do. If you’re having trouble with any of this, message me your problem and if that fails, then I do not know what to tell you, other then wait until the official update comes out.