Title: WordPress rendering page diffently from standard test.html
Last modified: August 19, 2016

---

# WordPress rendering page diffently from standard test.html

 *  [drchutney](https://wordpress.org/support/users/drchutney/)
 * (@drchutney)
 * [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/)
 * I’ve been playing around with using my own themes to create a CMS site for a 
   friend of mine. I’ve now encountered an interesting problem with the CSS.
 * If I create a bog standard test.html page with all the divs in the right locations
   and simply view this test page in a browser I can see the layout I’m expecting(
   a rectangle of colour with various div blocks on top ). If I now view it with
   all the WordPress data, it renders differently. In particular my overall ‘container’
   div loses the plot completely.
 * The page setup is roughly:
    html head /head
 * body
    div container width at 960px dark background colour div header area with
   logo etc then closing /div div menu bar and closing /div
 *  various divs to hold specific posts, but all with closing /divs
 *  div sidebar area with closing /div
 *  div footer area closing /div
 *  /div for container
 * /body
 * /html
 * My container has a background colour that I expect to see all over my page rectangle,
   but it gets as far as the header area and stops. Could the wp_page_menu call 
   be upsetting things? Has anyone else encountered this situation?
 * Ideas on a postcard please …

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

 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/#post-1407328)
 * wordpress is not rendering anything – your browser is.
    if you have the same 
   html structure around your php codes, the result should be the same. if it is
   not, double check your coding.
 * link?
 * or at least copy:
    the html of your test – from the browser; and the html of 
   your wordpress from the browser; and the style.css (or other style sheet) each
   into a [http://wordpress.pastebin.com/](http://wordpress.pastebin.com/) and post
   the links to these here.
 *  Thread Starter [drchutney](https://wordpress.org/support/users/drchutney/)
 * (@drchutney)
 * [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/#post-1407341)
 * I’ve dumped the WordPress generated HTML into Pastebin here
 * [http://wordpress.pastebin.com/a8gXCLHy](http://wordpress.pastebin.com/a8gXCLHy)
 * and all the CSS into here
 * [http://wordpress.pastebin.com/6WL6pyB5](http://wordpress.pastebin.com/6WL6pyB5)
 * It’s early days on this project and all I wanted to see was the correct blocks
   of colour in the right places. The other divs seem quite happy, but it’s the 
   first one holding them all together that has the problem.
 * And yes, I did realise my error in terminology, I was just trying to illustrate
   what I was finding from my own html code compared to WordPress generated html.
 * Thanks
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/#post-1407360)
 * seems to be a IE vs. firefox issue.
 * firefox looks quite good: [http://img205.imageshack.us/img205/4821/firefoxza.jpg](http://img205.imageshack.us/img205/4821/firefoxza.jpg)
 * IE7 has the background all over: [http://img17.imageshack.us/img17/6521/ie7p.jpg](http://img17.imageshack.us/img17/6521/ie7p.jpg)
 * do both tests have the same doctype?
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/#post-1407366)
 * forget what i just wrote: obviously you want the look of IE.
 * some code that gets used to ‘stretch’ the background despite ‘floating’ divs:
 *     ```
       <div id="footer"> 
   
               Copyright blah blah
   
       </div><!--  footer -->
       <div class="cleared"></div>
       ```
   
 * with the css:
    `.cleared { clear:both; }`
 * [http://www.webtoolkit.info/css-clearfix.html](http://www.webtoolkit.info/css-clearfix.html)
 * i still would have expected the same behaviour with the html-only-test.
 *  Thread Starter [drchutney](https://wordpress.org/support/users/drchutney/)
 * (@drchutney)
 * [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/#post-1407369)
 * Thanks for your thoughts on this.
    To be honest I was getting the Firefox effect
   from IE, Firefox and Opera. You at least managed to get that container div to
   cover the page in a brown wash.
 * I’ll take a step back and look at some other themes and see if there are better
   options ( particularly cross-browser ). There are always different approaches
   and if necessary I can always lay a background down block by block if necessary,
   although it would be nice to have that one container do the job.
 * I see an evening of experimentation approaching.

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

The topic ‘WordPress rendering page diffently from standard test.html’ is closed
to new replies.

## Tags

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

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5 replies
 * 2 participants
 * Last reply from: [drchutney](https://wordpress.org/support/users/drchutney/)
 * Last activity: [16 years, 2 months ago](https://wordpress.org/support/topic/wordpress-rendering-page-diffently-from-standard-testhtml/#post-1407369)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics