Support » How-To and Troubleshooting » Header Slideshow & Nav not resizing to fit screen sizes Twenty Eleven

Header Slideshow & Nav not resizing to fit screen sizes Twenty Eleven

  • Hi
    New to WordPress – Go Easy on me Please!
    I am having problems using the Header-slideshow plugin with the Twenty Eleven Theme – I have it all lined up and running as I want and appears fine on my laptop screen, but on other Screen Sizes/Resolutions it is all over the place and not resizing. The site is http://www.randombook.co.uk .

    It seems the Header Slideshow is floating just above the header position rather than being in that position – what is the code I need to add and to which file? I gather I should amend the header.php file? I am using a Child Theme (and I have amended the height of the Header on twenty eleven to 1000X150) . But why is the Navigation bar also a different size on different screens/resolutions? It becomes two rows of menu items which I don’t want! I simply want it all to stay as it appears on the screen I am working on! LOL
    The aim of all this is to have ten images randomly rotating as the header on every page of the site – I don’t want the in-built twenty eleven 1 image random each time you refresh. Is there an easier plugin to configure? CIMY?

    I have searched high and low for the answers to the header slideshow just ‘floating’ and written to the developer to no avail. I am probably missing something very simple (like having it under a DIV tag or something) but I don’t have the knowledge or skills to know what to put where. I am probably talking about two probs here, but I am now too confused.
    I am building this site free for a local Charity and they need it by the new School term so would be grateful of any help as I am pulling my hair out!

    (I am using WordPress 3.4.1, Latest Firefox and working on a laptop with a small 15.4 screen!)

    Please Please help me World!

Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator Andrew Nevins


    Forum moderator

    As you have a slider in your header, this has a set width of 1000px and therefore will not resize relative to browser sizes.

    You need to change this value to a percentage, of perhaps 100%.

    Thanks for your quick answer:

    Where do I change this value? Can I just do it in the slider settings height/width fields? Or do I need to change it in the coding in the files?

    Moderator Andrew Nevins


    Forum moderator

    How did you create the slideshow or was it included within the theme you’re using?

    It is the plugin called “header-slideshow” which I added.

    I seem to have configured it okay, modified the .xml file to the URLS of my images, but I just now want it to resize with the rest of the site. Also why is the nav bar similarly resizing weirdly?

    Moderator Andrew Nevins


    Forum moderator

    On line 676 of style.css, this is causing the navigation to resize “weirdly”;

    #branding .only-search + #access div {
     padding-right: 205px;

    Remember if you want to change this CSS, ensure you do-so through a Child Theme or Custom Style/CSS plugin.

    Okay so what should I change that code to in my child theme?

    (sorry but I have little knowledge of CSS)

    and the other issue of the slider – where do I change the values to 100% instead of 1000 pixels?

    Really appreciate your help and quick responses


    Anybody able to help further?

    I get that I need to change the code above in my child theme, but what to?

    And how do I get my slider in my header to be 100% and not 1000 pixels? I tried inputing it into the fields under header-slideshow settings, but it reverts to a completely different size. Which file do I need to amend?

    Really appreciate any guidance


Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Header Slideshow & Nav not resizing to fit screen sizes Twenty Eleven’ is closed to new replies.