Skip to content
This repository

Renaming the wrapper div ID from 'page' to 'wrapper' #119

wants to merge 4 commits into from

4 participants

Mario Peshev Ian Stewart Philip Newcomer Philip Arthur Moore
Mario Peshev

This is an open discussion, but I have semantic proposal for the wrapper div. Labeling it 'page' is ambiguous during both development and debugging as it implies that all views are page views. Since 'Page' is a term in the WordPress world, this might be a misinterpretation of a given scenario.

Historically wise, both twentyeleven and twentyten use this approach. The result is a body with class 'single' and some post-related classes and right below it a 'page' ID.

Whilst this is true, it certainly affects the process of debugging or even mistyping #page for .page somewhere in between. Using #container, #box or #wrapper is more general and imaginable, and don't forget that it was the preferred term for twentyten too ( )

Mario Peshev

P.S. #page is never referenced in style.css, so no extra damage would be caused to styling for new themes.

Ian Stewart

I've come to like #page because we use _s to make web pages not web wrappers.

Philip Newcomer

What about something like #page-wrap? That would be more descriptive of the purpose it serves.

Mario Peshev

I wouldn't use in my daily work a sentence such as: "The page of my post" (instead of 'the single view for my post or something') or 'The page with the last 10 blog posts' (instead of 'my index page' or 'the list with the latest posts'), since 'Page' is a term describing a specific type of object in WordPress.

Wrapper, or container, or box, or whatever, however, is not a name of an existing object leading to confusions and ambiguity.

My 2¢ only.

Philip Arthur Moore

If I were thinking of this from a WordPress-centric viewpoint, my thoughts would probably look something like the following:

  • I'm viewing a page right now.
  • I'm viewing a post right now.
  • I'm viewing the home page right now.
  • I'm viewing an archive page right now.
  • I'm viewing an error page right now.
  • You get the point.

When I browse the web casually, though, the only thought that ever pops into my head is:

  • I'm viewing a web page right now.

I'm voting to keep this as-is. Terms like wrapper, container, and box all sound very unnatural to me (this is subjective, to be sure). And I'd rather debug with the sentence "I'm fixing a page of stuff" in my head, regardless of whether or not WordPress is the platform being used to build that stuff.

Ian Stewart

WIth Philip's list above and, in the long run, this not affecting much I think we can close this one. Thanks for the input and ideas everyone.

Mario Peshev

@ianstewart thanks for the remarks.

For the record, this commit is still valid for me - mpeshev@27c2064 - haven't had the chance to test it on IE though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.

Showing 3 changed files with 4 additions and 4 deletions. Show diff stats Hide diff stats

  1. +2 2 footer.php
  2. +1 1  header.php
  3. +1 1  style.css
4 footer.php
@@ -19,9 +19,9 @@
2  header.php
@@ -23,7 +23,7 @@
23 23 </head>
24 24
25 25 <body <?php body_class(); ?>>
26   -<div id="page" class="hfeed site">
  26 +<div id="wrapper" class="hfeed site">
27 27 <?php do_action( 'before' ); ?>
28 28 <header id="masthead" class="site-header" role="banner">
29 29 <hgroup>
2  style.css
@@ -460,7 +460,7 @@ img[class*="wp-image-"] {
460 460 .entry-content img,
461 461 img.size-full {
462 462 max-width: 100%;
463   - width: auto; /* Prevent stretching of full-size images with height and width attributes in IE8 */
  463 + /*width: auto; */ /* Prevent stretching of full-size images with height and width attributes in IE8 */
464 464 }
465 465 .entry-content img.wp-smiley,
466 466 .comment-content img.wp-smiley {

Tip: You can add notes to lines in a file. Hover to the left of a line to make a note

Something went wrong with that request. Please try again.