Full Width template for Wordpress theme

Question

I added a full width template page to a Wordpress site for use on one page: http://pjstagingdecorating.com/portfolio-testing2/#DTprettyPhoto

I added a new PHP file as well as CSS to my stylesheet. The template does appear as an option BUT the content is not appearing across the full width of the page. PHP and CSS below.

<?php
/**
 * Template Name: Full Width
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages and that other
 * 'pages' on your WordPress site will use a different template.
 *
 * @package WordPress
 * @subpackage Twenty_Thirteen
 * @since Twenty Thirteen 1.0
 */

get_header(); ?>

    <div id="primary" class="content-area">
        <div id="content" class="site-content" role="main">

            <?php /* The loop */ ?>
            <?php while ( have_posts() ) : the_post(); ?>

                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                    <header class="entry-header full-width">
                        <?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
                        <div class="entry-thumbnail">
                            <?php the_post_thumbnail(); ?>
                        </div>
                        <?php endif; ?>

                        <?php if (is_front_page()) : ?>
<?php else : ?>
<h1 class="entry-title full-width"><?php the_title(); ?></h1>
<?php endif; ?>
                    </header><!-- .entry-header -->

                    <div class="entry-content full-width">
                        <?php the_content(); ?>
                        <?php wp_link_pages( array( 'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentythirteen' ) . '</span>', 'after' => '</div>', 'link_before' => '<span>', 'link_after' => '</span>' ) ); ?>
                    </div><!-- .entry-content -->

                    <footer class="entry-meta">
                        <?php edit_post_link( __( 'Edit', 'twentythirteen' ), '<span class="edit-link">', '</span>' ); ?>
                    </footer><!-- .entry-meta -->
                </article><!-- #post -->

            <?php endwhile; ?>

        </div><!-- #content -->
    </div><!-- #primary -->

<?php get_footer(); ?> 

And the CSS:

.full-width {
    margin-left: auto !important;
    margin-right: auto !important;
    height: auto;
    padding-right: 1em !important;
}

Any thoughts on what I am doing wrong? Thanks!

Answer 1

Add this to ur css file:

.page-template-fullwidth .div#primary, .page-template-fullwidth .hentry {max-width:100%!important;}

It is recommended to create a Child theme to modify a Wordpress theme or your changes will be reset while you update your theme. Here is a guide you can follow to create child theme: http://variablez.com/wordpress/how-to-create-a-wordpress-child-theme