Title: Different post views with same template & css
Last modified: June 1, 2025

---

# Different post views with same template & css

 *  Resolved [timothy12](https://wordpress.org/support/users/timothy12/)
 * (@timothy12)
 * [12 months ago](https://wordpress.org/support/topic/different-post-views-with-same-template-css/)
 * I’ve an issue and I have no clue what is causing it. I’ve a site with several
   posts, all using the same template (parts). Still there is a difference in how
   the page is displayed. On some pages, the social icons and the pagination are
   placed out of/under the div, while on other pages there are in it (as I want 
   them to be).At [the image](https://www.dropbox.com/scl/fi/8127epcrqia3h5vgz3hwd/Screenshots.png?rlkey=sn9q1qqpiommcxtdwux8jbth3&dl=0)
   you can see both situations. A is with the items outside the div, B has them 
   inside. 
   This is the source code of the page A. The div #content is the parent
   div in which all content should be. As you can see, the pagination is in the 
   div, but in some occasions it’s placed outside it.`<div id="content"> <div class
   ="insidebox"<article id="post-372" class="post-372 post type-post status-publish
   format-standard has-post-thumbnail hentry category-docs category-klassenmanagement
   tag-kennismaken tag-nieuwe-klas tag-start-schooljaar tag-voorstellen tag-wennen
   tag-werkblad"><h1>Werkblad kennismaken</h1> <!-- post-label: datum & auteur --
   > <div class="post-label"> <div class="publication-date">5 augustus 2019</div
   ><!-- /.publication-date --> <div class="info-divider">|</div><!-- /.info-divider--
   > <div class="author">Meester Erik</div><!-- /.author --> </div><!-- /.post-label--
   ><!-- inhoud post --> <div class="post-content"><p>Wenochtend. Stoeltjespassen.
   Het heeft verschillende namen, maar het moment dat je kennis gaat maken met je
   nieuwe klas, kent iedereen.</p><span id="more-372"></span><p>Het blad waarop 
   kinderen dingen over zichzelf invullen, ontbreekt op zo’n moment natuurlijk niet.
   Ontelbare vriendenboekjes zijn er online te vinden, zo ook op deze pagina.</p
   ><figure class="wp-block-image"><img decoding="async" src="[https://www.meestererik.nl/wp-content/uploads/2025/06/werkblad-kennismaken.jpg](https://www.meestererik.nl/wp-content/uploads/2025/06/werkblad-kennismaken.jpg)"
   alt=""/></figure><h3 class="wp-block-heading">Download</h3><div class="downloadbox"
   ><div class="downloadbox-item"><div class="icon-type"><span class="icon-get_app"
   ></span></div><div class="download-content"><a href="[https://www.meestererik.nl/wp-content/uploads/2019/08/werkblad-kennismaking.pdf](https://www.meestererik.nl/wp-content/uploads/2019/08/werkblad-kennismaking.pdf)"
   target="_blank" rel="noreferrer noopener">Werkblad voorstellen</a></div></div
   ></div><!-- /.downloadbox --></div><!-- /.post-content --><!-- post-label: categorieën,
   tags & edit --> <div class="post-label"> <div id="post-categories"><ul class="
   post-categories"> <li><a href="[https://www.meestererik.nl/docs](https://www.meestererik.nl/docs)"
   rel="category tag">Docs</a></li> <li><a href="[https://www.meestererik.nl/klassenmanagement](https://www.meestererik.nl/klassenmanagement)"
   rel="category tag">Klassenmanagement</a></li></ul></div><!-- /#post-categories--
   ><div id="post-tags"><a href="[https://www.meestererik.nl/tag/kennismaken](https://www.meestererik.nl/tag/kennismaken)"
   rel="tag">kennismaken</a><a href="[https://www.meestererik.nl/tag/nieuwe-klas](https://www.meestererik.nl/tag/nieuwe-klas)"
   rel="tag">nieuwe klas</a><a href="[https://www.meestererik.nl/tag/start-schooljaar](https://www.meestererik.nl/tag/start-schooljaar)"
   rel="tag">start schooljaar</a><a href="[https://www.meestererik.nl/tag/voorstellen](https://www.meestererik.nl/tag/voorstellen)"
   rel="tag">voorstellen</a><a href="[https://www.meestererik.nl/tag/wennen](https://www.meestererik.nl/tag/wennen)"
   rel="tag">wennen</a><a href="[https://www.meestererik.nl/tag/werkblad](https://www.meestererik.nl/tag/werkblad)"
   rel="tag">werkblad</a></div></div><!-- /#post-tags --><div id="post-edit"><a 
   class="post-edit-link" href="[https://www.meestererik.nl/wp-admin/post.php?post=372&action=edit](https://www.meestererik.nl/wp-admin/post.php?post=372&action=edit)"
   >Bewerk post <span class="screen-reader-text">Werkblad kennismaken</span></a>
   </div><!-- /#post-edit --> </div><!-- /.post-label --><div id="post-navigation"
   ><div class="post-navigation post-next"> <a href="[https://www.meestererik.nl/sporen](https://www.meestererik.nl/sporen)"
   rel="next"><div class="icon-chevron-left"></div><div class"post-title">Sporen
   </div></a> </div><!-- /.post-next --><div class="post-navigation post-prev"> 
   <a href="[https://www.meestererik.nl/vertelpantomime-kapitein-roodbaard](https://www.meestererik.nl/vertelpantomime-kapitein-roodbaard)"
   rel="prev"><div class="post-title">Vertelpantomime – Kapitein Roodbaard</div>
   <div class="icon-chevron-right"></div></a> </div><!-- /.post-prev --></div><!--/#
   post-navigation --></article><!-- #post-372 --> </div><!-- /.insidebox --> </
   div><!-- /#content -->
 * I don’t know if the publishing date has something to do with it, but situation
   A occurs on post published before February 2024.
   I hope someone can give me clue!
   🙂Kind regards,Timothy

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [rickymccallum87](https://wordpress.org/support/users/rickymccallum87/)
 * (@rickymccallum87)
 * [12 months ago](https://wordpress.org/support/topic/different-post-views-with-same-template-css/#post-18492808)
 * There are various typos in the source code: missing brackets in tags, duplicate
   tag attributes, missing equal sign in attributes, etc. You can paste your HTML
   into [the W3C HTML validator](https://validator.w3.org/#validate_by_input) to
   have them all listed out for you. Fixing the typos will probably fix the issues
   with elements breaking out of their containers.
 *  Thread Starter [timothy12](https://wordpress.org/support/users/timothy12/)
 * (@timothy12)
 * [12 months ago](https://wordpress.org/support/topic/different-post-views-with-same-template-css/#post-18492852)
 * [@rickymccallum87](https://wordpress.org/support/users/rickymccallum87/) Thans
   for your reply! I’m going to try the validator. I’ve found some typing errors
   indeed and fixed those. I’m trying to understand the messags, but not all of 
   them become clear already so I share those with you. Here are my thoughts.
 * This is the new source code without the typing errors.
 *     ```wp-block-code
       <div id="content"> <div class="insidebox"><article id="post-372" class="post-372 post type-post status-publish format-standard has-post-thumbnail hentry category-docs category-klassenmanagement tag-kennismaken tag-nieuwe-klas tag-start-schooljaar tag-voorstellen tag-wennen tag-werkblad"><h1>Werkblad kennismaken</h1> <!-- post-label: datum & auteur --> <div class="post-label"> <div class="publication-date">5 augustus 2019</div><!-- /.publication-date --> <div class="info-divider">|</div><!-- /.info-divider --> <div class="author">Meester Erik</div><!-- /.author --> </div><!-- /.post-label --><!-- inhoud post --> <div class="post-content"><p>Wenochtend. Stoeltjespassen. Het heeft verschillende namen, maar het moment dat je kennis gaat maken met je nieuwe klas, kent iedereen.</p><span id="more-372"></span><p>Het blad waarop kinderen dingen over zichzelf invullen, ontbreekt op zo’n moment natuurlijk niet. Ontelbare vriendenboekjes zijn er online te vinden, zo ook op deze pagina.</p><figure class="wp-block-image"><img decoding="async" src="https://www.meestererik.nl/wp-content/uploads/2025/06/werkblad-kennismaken.jpg" alt=""/></figure><h3 class="wp-block-heading">Download</h3><div class="downloadbox"><div class="downloadbox-item"><div class="icon-type"><span class="icon-get_app"></span></div><div class="download-content"><a href="https://www.meestererik.nl/wp-content/uploads/2019/08/werkblad-kennismaking.pdf" target="_blank" rel="noreferrer noopener">Werkblad voorstellen</a></div></div></div><!-- /.downloadbox --></div><!-- /.post-content --><!-- post-label: categorieën, tags & edit --> <div class="post-label"> <div id="post-categories"><ul class="post-categories"> <li><a href="https://www.meestererik.nl/docs" rel="category tag">Docs</a></li> <li><a href="https://www.meestererik.nl/klassenmanagement" rel="category tag">Klassenmanagement</a></li></ul></div><!-- /#post-categories --><div id="post-tags"><a href="https://www.meestererik.nl/tag/kennismaken" rel="tag">kennismaken</a><a href="https://www.meestererik.nl/tag/nieuwe-klas" rel="tag">nieuwe klas</a><a href="https://www.meestererik.nl/tag/start-schooljaar" rel="tag">start schooljaar</a><a href="https://www.meestererik.nl/tag/voorstellen" rel="tag">voorstellen</a><a href="https://www.meestererik.nl/tag/wennen" rel="tag">wennen</a><a href="https://www.meestererik.nl/tag/werkblad" rel="tag">werkblad</a></div></div><!-- /#post-tags --><div id="post-edit"><a class="post-edit-link" href="https://www.meestererik.nl/wp-admin/post.php?post=372&action=edit">Bewerk post <span class="screen-reader-text">Werkblad kennismaken</span></a></div><!-- /#post-edit --> </div><!-- /.post-label --><div id="post-socials"> <div class="widget-box"><div class="a2a_kit a2a_kit_size_32 addtoany_list"><a class="a2a_button_facebook" href="https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fwww.meestererik.nl%2Fwerkblad-kennismaken&amp;linkname=Meester%20Erik%20%7C%20Werkblad%20kennismaken" title="Facebook" rel="nofollow noopener" target="_blank"></a><a class="a2a_button_linkedin" href="https://www.addtoany.com/add_to/linkedin?linkurl=https%3A%2F%2Fwww.meestererik.nl%2Fwerkblad-kennismaken&amp;linkname=Meester%20Erik%20%7C%20Werkblad%20kennismaken" title="LinkedIn" rel="nofollow noopener" target="_blank"></a><a class="a2a_button_pinterest" href="https://www.addtoany.com/add_to/pinterest?linkurl=https%3A%2F%2Fwww.meestererik.nl%2Fwerkblad-kennismaken&amp;linkname=Meester%20Erik%20%7C%20Werkblad%20kennismaken" title="Pinterest" rel="nofollow noopener" target="_blank"></a><a class="a2a_button_whatsapp" href="https://www.addtoany.com/add_to/whatsapp?linkurl=https%3A%2F%2Fwww.meestererik.nl%2Fwerkblad-kennismaken&amp;linkname=Meester%20Erik%20%7C%20Werkblad%20kennismaken" title="WhatsApp" rel="nofollow noopener" target="_blank"></a></div></div> </div><!-- /#post-socials --><div id="post-navigation"><div class="post-navigation post-next"> <a href="https://www.meestererik.nl/sporen" rel="next"><div class="icon-chevron-left"></div><div class="post-title">Sporen</div></a> </div><!-- /.post-next --><div class="post-navigation post-prev"> <a href="https://www.meestererik.nl/vertelpantomime-kapitein-roodbaard" rel="prev"><div class="post-title">Vertelpantomime – Kapitein Roodbaard</div><div class="icon-chevron-right"></div></a> </div><!-- /.post-prev --></div><!-- /#post-navigation --></article><!-- #post-372 --> </div><!-- /.insidebox --> </div><!-- /#content -->
       ```
   
 * Messages 1, 2 and 3, are caused by the fact that I copied the snipped out of 
   the source code where the problem occurs. The missing elements are in the header.
   php of the site.
 * Message 4: I don’t know what is meant by trailing slash on void elements.
 * Message 5: What is meant by the open elements? Are that the `<article>` in message
   6? and first div in the sourcecode?
 * Message 7: Because of the div (message 5) `<article>` is expected to be closed,
   but isn’t (see message 6). But it’s because of that same div, the position of`
   </article>` is considered to be weird.
 * Message 8: There is a </div> to many in the coding: the div of message 5. Due
   to that div, the closing div of message 8 is considered to be one to many. (But
   the closing div of message 5 is causing a lot of trouble.)
   I hope you can follow
   my thougths and that can you explain the things I don’t understand, especially
   message 4.Kind regards!
 *  [rickymccallum87](https://wordpress.org/support/users/rickymccallum87/)
 * (@rickymccallum87)
 * [12 months ago](https://wordpress.org/support/topic/different-post-views-with-same-template-css/#post-18492881)
 * You’re right about everything you’ve said. All you need to do is remove the `
   </div>` shown in message 5.
 * Message 4 is an “info” message, not an error, so you can ignore it. If you’d 
   like to understand it, click the explanatory hyperlinks included in the message.
 *  Thread Starter [timothy12](https://wordpress.org/support/users/timothy12/)
 * (@timothy12)
 * [12 months ago](https://wordpress.org/support/topic/different-post-views-with-same-template-css/#post-18492891)
 * I had some trouble finding the “extra” closing div, but I’ve found it. I still
   find it weird that the error with the pagination didn’t occur on each page, while
   all of them are using the same template (parts). 
   Thanks for your tips and checking
   my thoughts [@rickymccallum87](https://wordpress.org/support/users/rickymccallum87/)!

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Different post views with same template & css’ is closed to new replies.

## Tags

 * [container](https://wordpress.org/support/topic-tag/container/)
 * [css](https://wordpress.org/support/topic-tag/css/)
 * [div](https://wordpress.org/support/topic-tag/div/)
 * [html](https://wordpress.org/support/topic-tag/html/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5 replies
 * 2 participants
 * Last reply from: [timothy12](https://wordpress.org/support/users/timothy12/)
 * Last activity: [12 months ago](https://wordpress.org/support/topic/different-post-views-with-same-template-css/#post-18492891)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics