CODEWITHSUNDEEP
csstumblr
Sebastian
Sebastian

Reputation: 3628

Why doesn't this wrapper on Tumblr include everything in the block?

Here's my site.

I stupidly changed something that I couldn't revert, and now the bottom two posts aren't included in the wrapper, i.e. they spread out to cover the full width of the page rather than sitting inside a container.

Here's my code:

<div class="wrapper">
  <div class="autopagerize_page_element">

  <div class="posts"></div>
  <div class="header-posts">
    <!-- LINK START -->
    <div class="left">
      <h3><a href="http://www.youtube.com/janedoe"  target="_blank" >Jane Doe</a></h3>
      <h4><p>Description</p></h4></div>
    </div>
    <div class="right frame">
      <img src="http://33.media.tumblr.com/avatar_6f4efed0cfcf_30.png" style="border-radius: 40px;">
    </div>
    <div style="clear:both"></div>    
    <!-- LINK END -->
  </div>

  <div class="posts"></div>
  <div class="header-posts">
    <!-- LINK START -->
    <div class="left">
      <h3><a href="http://youtube.com/johnsmith"  target="_blank" >John Smith</a></h3>          
      <h4><p>Description</p></h4></div>                    
    </div>
    <div class="right frame">
      <img src="http://33.media.tumblr.com/avatar_6f4efed0cfcf_30.png" style="border-radius: 40px;">
    </div>
    <div style="clear:both"></div>
    <!-- LINK END -->        
  </div>

  <div class="posts"></div>
  <div class="header-posts">
    <!-- LINK START -->
    <div class="left">
      <h3><a href="http://www.youtube.com/joebloggs"  target="_blank" >Joe Bloggs</a></h3>            
      <h4><p>Description</p></h4></div>             
     </div>
     <div class="right frame"></div>
     <div style="clear:both"></div>
     <!-- LINK END -->
  </div>

  <div class="posts"></div>
  <div class="header-posts">
    <!-- LINK START -->
    <div class="left">
      <h3><a href="http://www.youtube.com/exampleperson"  target="_blank" >Example Person</a></h3>
      <h4><p>Description</p></h4></div>
    </div>
    <div class="right frame">
      <img src="http://33.media.tumblr.com/avatar_6f4efed0cfcf_30.png" style="border-radius: 40px;">
    </div>
    <div style="clear:both"></div>
  </div>

  </div>
<!-- PAGINATION --> 
</div>

I can see the problem (the <div class="right frame"> closing in the third block with nothing in it) but the problem is I'm editing on Tumblr where it looks like this in the editor:

{block:Link}
<div class="left">
  <h3><a href="{URL}" {Target}>{Name}</a></h3>
  {block:Description}
  <h4>{Description}</h4></div>
  {/block:Description}
</div>
<div class="right frame">
  <img src="{PostAuthorPortraitURL-30}" style="border-radius: 40px;">
</div>
<div style="clear:both"></div>
{/block:Link}

My second question is: how can I better troubleshoot so I can solve these problems myself in future?

Upvotes: 0

Views: 238

Answers (1)

rmobis
rmobis

Reputation: 27002

That's why:

<h4>{Description}</h4></div>

See that extra </div>? It's likely closing your wrapper.

Upvotes: 2

Related Questions