2015-09-23 2 views
0

Я делаю тему Tumblr, и сообщения продолжают выходить из границы, которую я установил для своей обертки. Первые две должности будут придерживаться этого, но после этого последующие отрываются, как будто они вообще не завернуты div. Пожалуйста, помогите мне.Сообщения выходят из обертки

Вот картина: http://postimg.org/image/klkyjsesh/

Вот часть моего кода:

\t #contentarea { 
 
\t  margin-top: 80px; 
 
     width:400px; 
 
\t  margin-left: auto; 
 
     margin-right: auto; 
 
     min-height: 100%; 
 
     
 

 
\t } 
 
\t 
 
\t .entrygroup { 
 
\t  width: 400px; 
 
\t  margin-bottom: 10px; 
 
    \t background: #fcfcfc; 
 
\t \t margin-left: 8px; 
 
\t \t margin-right: 8px; 
 
\t \t padding: 10px; 
 
\t \t padding-bottom: 30px; 
 
\t \t border-radius: 8px; 
 
\t \t display: block; 
 
\t \t 
 
\t \t 
 
\t }
<div id="contentarea"> \t 
 
<div class="autopagerize_page_element"> \t 
 
{block:Posts} 
 
    <div class="entrygroup"> 
 
\t \t {block:Text} 
 
\t \t \t <div class="entry"> \t 
 
\t \t <div class="textpost"> 
 
\t \t \t {block:Title} 
 
\t \t \t \t <h3> 
 
\t \t \t \t \t <a href="{Permalink}" style="color: 
 

 
black">{Title}</a> 
 
\t \t \t \t </h3> 
 
\t \t \t {/block:Title} 
 
\t \t \t {Body} 
 
\t \t </div> 
 
\t \t  <ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes}</div> 
 
\t \t </div> 
 
\t \t {/block:Text} 
 

 

 
\t \t {block:Photo} <div class="entry"> 
 
\t \t <div class="photopost"> \t 
 
\t \t \t <img src="{PhotoURL-400}"> 
 
\t \t \t {block:Caption}{Caption}{/block:Caption} 
 
\t \t </div> 
 
\t \t  <ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes}</div> 
 
\t \t </div> 
 
\t \t {/block:Photo} 
 
\t \t 
 
\t \t 
 
\t 
 
\t \t {block:Photoset} <div class="entry"> \t 
 
\t \t  <div class="photosetpost"> \t 
 
\t \t \t {Photoset-400} 
 
\t \t \t {block:Caption}{Caption}{/block:Caption} 
 
\t \t </div><ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes} 
 

 
</div></div> 
 
\t \t {/block:Photoset} 
 

 

 
\t \t {block:Quote}<div class="entry"> 
 
\t \t <div class="quotepost"> 
 
\t \t \t {Quote} 
 
\t  \t {block:Source}<div class="quotesource"><br>&mdash;{Source} 
 

 
</div>{/block:Source} 
 
\t \t </div><ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes} 
 

 
</div></div> 
 
\t \t {/block:Quote} 
 

 

 
\t \t {block:Link}<div class="entry"> 
 
\t \t <div class="linkpost"> 
 
    \t \t \t <a href="{URL}" {Target} style="color: black"> 
 
{Name}</a> 
 
    \t \t \t {block:Description}{Description} 
 
{/block:Description} 
 
\t \t </div> 
 
\t \t <ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
</div></div> 
 
\t \t {/block:Link} 
 

 

 
\t \t {block:Chat}<div class="entry"> 
 
\t \t <div class="chatpost"> 
 
\t \t \t {block:Title}{Title}{/block:Title} 
 
\t \t \t <table> 
 
\t \t \t \t {block:Lines} 
 
\t \t \t \t <tr> 
 
\t \t \t \t \t <th>{block:Label}{Label} 
 

 
{/block:Label}</th> 
 
\t \t \t \t \t <td>{Line}</td> 
 
\t \t \t \t </tr> 
 
\t \t \t \t {/block:Lines} 
 
\t \t \t </table> 
 
\t \t </div><ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes} 
 

 
</div></div> 
 
\t \t {/block:Chat} 
 

 

 
\t \t {block:Audio}<div class="entry"> 
 
\t \t <div class="audiopost"> 
 
\t \t \t {AudioPlayer} 
 
     \t {block:Caption}{Caption}{/block:Caption} 
 
\t \t </div><ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes} 
 

 
</div></div> 
 
\t \t {/block:Audio} 
 

 

 
\t \t {block:Video}<div class="entry"> 
 
\t \t <div class="videopost"> 
 
\t \t \t {Video-500} 
 
\t \t \t {block:Caption}{Caption}{/block:Caption} 
 
\t \t </div><ul class="like-reblog"> 
 
\t \t \t \t <li>{LikeButton size="15"}</li> 
 
\t \t \t \t <li>{ReblogButton size="15"}</li> 
 
\t \t \t \t <li>{block:NoteCount}<a href="{permalink} 
 

 
#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
\t \t \t \t <li>{block:Date}<a href="{Permalink}"> 
 

 
{TimeAgo}</a>{/block:Date}</li> 
 
\t \t \t </ul> 
 
\t \t  {block:PostNotes}{PostNotes}{/block:PostNotes} 
 

 
</div></div> 
 
\t \t {/block:Video} 
 

 

 
</div> 
 
\t {/block:Posts} 
 
\t </div></div>

+0

Можете ли вы опубликовать визуализированный HTML? –

ответ

0

Проблема в вас HTML код близко ДИВ на неправильном месте.

<div id="contentarea"> 
 
    <div class="autopagerize_page_element"> 
 
    {block:Posts} 
 
     <div class="entrygroup"> 
 
      {block:Text} 
 
       <div class="entry"> 
 
        <div class="textpost"> 
 
        {block:Title} 
 
         <h3> 
 
          <a href="{Permalink}" style="color: black">{Title}</a> 
 
         </h3> 
 
        {/block:Title} 
 
        {Body} 
 
        </div> 
 
        <ul class="like-reblog"> 
 
         <li>{LikeButton size="15"}</li> 
 
         <li>{ReblogButton size="15"}</li> 
 
         <li>{block:NoteCount}<a href="{permalink} #notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
         <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
        </ul> 
 
        {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
       </div> 
 
     </div> 
 
     {/block:Text} 
 

 

 
     {block:Photo} 
 
     <div class="entry"> 
 
      <div class="photopost"> 
 
       <img src="{PhotoURL-400}"> 
 
       {block:Caption}{Caption}{/block:Caption} 
 
      </div> 
 
       <ul class="like-reblog"> 
 
        <li>{LikeButton size="15"}</li> 
 
        <li>{ReblogButton size="15"}</li> 
 
        <li>{block:NoteCount}<a href="{permalink} #notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
        <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
       </ul> 
 
       {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Photo} 
 
      {block:Photoset} 
 
     <div class="entry">  
 
      <div class="photosetpost"> 
 
      {Photoset-400} 
 
      {block:Caption}{Caption}{/block:Caption} 
 
      </div> 
 
      <ul class="like-reblog"> 
 
       <li>{LikeButton size="15"}</li> 
 
       <li>{ReblogButton size="15"}</li> 
 
       <li>{block:NoteCount}<a href="{permalink} #notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
       <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
      </ul> 
 
      {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Photoset} 
 
      {block:Quote} 
 
     <div class="entry"> 
 
      <div class="quotepost"> 
 
       {Quote} 
 
       {block:Source}<div class="quotesource"><br>&mdash;{Source}</div> 
 
       {/block:Source} 
 
      </div> 
 
      <ul class="like-reblog"> 
 
        <li>{LikeButton size="15"}</li> 
 
        <li>{ReblogButton size="15"}</li> 
 
        <li>{block:NoteCount}<a href="{permalink} #notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
        <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
       </ul> 
 
       {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Quote} 
 
      {block:Link} 
 
     <div class="entry"> 
 
      <div class="linkpost"> 
 
       <a href="{URL}" {Target} style="color: black">{Name}</a> 
 
       {block:Description}{Description}{/block:Description} 
 
      </div> 
 
       <ul class="like-reblog"> 
 
        <li>{LikeButton size="15"}</li> 
 
        <li>{ReblogButton size="15"}</li> 
 
        <li>{block:NoteCount}<a href="{permalink} #notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
        <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
       </ul> 
 
       {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Link} 
 
      {block:Chat} 
 
     <div class="entry"> 
 
      <div class="chatpost"> 
 
       {block:Title}{Title}{/block:Title} 
 
       <table> 
 
        {block:Lines} 
 
        <tr> 
 
         <td>{block:Label}{Label}{/block:Label}</td> 
 
         <td>{Line}</td> 
 
        </tr> 
 
        {/block:Lines} 
 
       </table> 
 
      </div> 
 
       <ul class="like-reblog"> 
 
        <li>{LikeButton size="15"}</li> 
 
        <li>{ReblogButton size="15"}</li> 
 
        <li>{block:NoteCount}<a href="{permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
        <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
       </ul> 
 
       {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Chat} 
 
      {block:Audio} 
 
     <div class="entry"> 
 
      <div class="audiopost"> 
 
       {AudioPlayer} 
 
      {block:Caption}{Caption}{/block:Caption} 
 
      </div> 
 
      <ul class="like-reblog"> 
 
       <li>{LikeButton size="15"}</li> 
 
       <li>{ReblogButton size="15"}</li> 
 
       <li>{block:NoteCount}<a href="{permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
       <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
      </ul> 
 
      {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Audio} 
 
      {block:Video} 
 
     <div class="entry"> 
 
      <div class="videopost"> 
 
       {Video-500} 
 
       {block:Caption}{Caption}{/block:Caption} 
 
      </div> 
 
      <ul class="like-reblog"> 
 
       <li>{LikeButton size="15"}</li> 
 
       <li>{ReblogButton size="15"}</li> 
 
       <li>{block:NoteCount}<a href="{permalink} #notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li> 
 
       <li>{block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date}</li> 
 
      </ul> 
 
       {block:PostNotes}{PostNotes}{/block:PostNotes} 
 
     </div> 
 
      {/block:Video} 
 
    </div> 
 
     {/block:Posts} 
 
</div>

Вы должны попробовать это,

Я надеюсь, что это будет поможет вам.

+0

Это сработало !! Спасибо огромное! Как вы это знаете? Я был настолько смущен, и я бесплодно пытался редактировать его столько раз. Благодаря!!! – MSMR

Смежные вопросы