Title: Responsive Header problem
Last modified: August 20, 2016

---

# Responsive Header problem

 *  Resolved [odalaigh](https://wordpress.org/support/users/odalaigh/)
 * (@odalaigh)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/responsive-header-problem/)
 * Im having problems finding out where I went wrong with my header. The slideshow
   loads just fine but has no responsiveness. my noob html skills showing thru..
 * [Site](http://darkskycoast.com/)
 *     ```
       <?php
       /**
        * The Header for our theme.
        *
        * Displays all of the <head> section and everything up till <div id="main">
        *
        * @package WordPress
        * @subpackage Twenty_Twelve
        * @since Twenty Twelve 1.0
        */
       ?><!DOCTYPE html>
       <!--[if IE 7]>
       <html class="ie ie7" <?php language_attributes(); ?>>
       <![endif]-->
       <!--[if IE 8]>
       <html class="ie ie8" <?php language_attributes(); ?>>
       <![endif]-->
       <!--[if !(IE 7) | !(IE 8)  ]><!-->
       <html <?php language_attributes(); ?>>
       <!--<![endif]-->
       <head>
       <meta charset="<?php bloginfo( 'charset' ); ?>" />
       <meta name="viewport" content="width=device-width" />
       <title><?php wp_title( '|', true, 'right' ); ?></title>
       <link rel="profile" href="http://gmpg.org/xfn/11" />
       <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
       <?php // Loads HTML5 JavaScript file to add support for HTML5 elements in older IE versions. ?>
       <!--[if lt IE 9]>
       <script src="<?php echo get_template_directory_uri(); ?>/js/html5.js" type="text/javascript"></script>
       <![endif]-->
       <?php wp_head(); ?>
       </head>
   
       <body <?php body_class(); ?>>
   
       <div id="page" class="hfeed site">
       	<header id="masthead" class="site-header" role="banner">
       <div style="text-align:center; width:1050px; margin-top:-60px; margin-left:auto; margin-right:auto;">
       <div style="z-index: 100; position:relative; left: 0px;  top: 37px">
       <img alt="top image" src="http://darkskycoast.com/wp-content/uploads/2013/03/banner8_with_overlap.png">
       </div>
       <?php do_action('slideshow_deploy', '849'); ?>
       </div>
   
       		<nav id="site-navigation" class="main-navigation" role="navigation">
       			<h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
       			<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
       			<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
       		</nav><!-- #site-navigation -->
   
       	</header><!-- #masthead -->
   
       	<div id="main" class="wrapper">
       ```
   
 * [http://wordpress.org/extend/plugins/slideshow-jquery-image-gallery/](http://wordpress.org/extend/plugins/slideshow-jquery-image-gallery/)

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

 *  Plugin Author [Stefan Boonstra](https://wordpress.org/support/users/stefanboonstra/)
 * (@stefanboonstra)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/responsive-header-problem/#post-3617624)
 * I see that the element containing the slideshow has a fixed width of 1050 pixels.
   This element does not resize when the browser window gets smaller, therefore 
   the slideshow doesn’t resize either.
 * If you remove the 1050 pixels style rule, the slideshow does resize. The header
   above the slideshow probably needs a width rule of 100% to be able to resize 
   as well.
 * It would then look something like this:
 *     ```
       <div style="text-align:center; margin-top:-60px; margin-left:auto; margin-right:auto;">
           <div style="z-index: 100; position:relative; left: 0px;  top: 37px">
               <img alt="top image" src="http://darkskycoast.com/wp-content/uploads/2013/03/banner8_with_overlap.png" style="width:100%">
           </div>
           <?php do_action('slideshow_deploy', '849'); ?>
       </div>
       ```
   
 *  Thread Starter [odalaigh](https://wordpress.org/support/users/odalaigh/)
 * (@odalaigh)
 * [13 years, 2 months ago](https://wordpress.org/support/topic/responsive-header-problem/#post-3617662)
 * awesome worked perfectly!

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

The topic ‘Responsive Header problem’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/slideshow-jquery-image-gallery_d3d2de.
   svg)
 * [Slideshow](https://wordpress.org/plugins/slideshow-jquery-image-gallery/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/slideshow-jquery-image-gallery/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/slideshow-jquery-image-gallery/)
 * [Active Topics](https://wordpress.org/support/plugin/slideshow-jquery-image-gallery/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/slideshow-jquery-image-gallery/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/slideshow-jquery-image-gallery/reviews/)

 * 2 replies
 * 2 participants
 * Last reply from: [odalaigh](https://wordpress.org/support/users/odalaigh/)
 * Last activity: [13 years, 2 months ago](https://wordpress.org/support/topic/responsive-header-problem/#post-3617662)
 * Status: resolved