Not fully responsive – certain browsers

Forums » WordPress » Tempera » Bugs

  • Author
    Posts
  • April 18th, 2014 at 05:28 #24871
    Carrie Moore

    I’m having an interesting problem I’ll try to describe. I’m using Tempera 1.0, WP 3.9. When my browser window is fully open, the site looks fine. If you start resize the window smaller, for awhile the header isn’t responsive, it just chops off the right side. After you get smaller than a certain window size, Tempera adjusts the images so they fit the window. The cryout columns also seem to be affected until you get to the smaller size when it adjusts to two columns vs. three. The middle one on the bottom (preview template) is not in line with the others on the y-axis (if it were a graph).

    Troubleshooting steps I’ve taken:
    -Tried different browsers – problem exists in Chrome, Firefox, Safari and IE for intermediate window sizes. Problem exists on android tablet as well.
    -Disabled all plugins
    -Switched to TwentyTwelve – resize works normally
    -Deleted and reinstalled Tempera
    -Tried multiple Tempera layouts and multiple header images.

    FWIW – I use a laptop with a small screen but it used to work just fine. It also doesn’t give a horizontal scroll bar when cutting off the right side. If it makes a difference, I use BlueHost.

    April 18th, 2014 at 05:30 #24872
    Carrie Moore

    Whoops – probably just the header having the resize issue. The cryout column stagger might be from “templates and layouts” bumping to two lines (therefore, responsive). However, the header is still getting cut off.

    July 22nd, 2014 at 20:35 #26261
    terrence

    I am having the same issue with the header image getting cut off on the right side, specifically in landscape view on Kindles and iPads and some desktop resolution settings.

    Has there been any resolution to this issue? Thanks!

    July 24th, 2014 at 19:59 #26289
    terrence

    here is the CSS I added to fix the issue:

    @media all and (max-width:1155px) {
    #bg_image{width:100%;}
    #branding{height:auto !important;}
    }

    August 1st, 2014 at 16:33 #26434
    Kay
    Cryout Creations mastermind

    Hi!

    Thanks for your feedback. The ‘Keep header image aspect ratio’ option will be altered in the next theme update to make the header image completely responsive. Until then Terrence’s code will do the trick.

    Thanks a lot for the feedback guys.

    Before posting consider reading our short theme debugging instructions.
    Please read the FAQs: Mantra • Nirvana • Parabola • Tempera
    Tutorials: custom menus • translating theme • installing theme • category page with intro • disabling comments Wordpress: child themes • categories/posts
    Before making any modifications to your theme we strongly recommend using Child Themes.
    August 4th, 2014 at 14:53 #26486
    James Forrest

    Hi Kay and Terrance

    I was just wondering where you put that particular piece of code to get it working?

    Thanks

    August 7th, 2014 at 12:09 #26556
    Kay
    Cryout Creations mastermind

    Hi guys,

    This has been included in the 1.2.2 update. Check the ‘Kepp Header Image Aspect Ratio’ option in Header Settings to enable fully responsive header image.

    Thanks for the feedback and good luck!

    Before posting consider reading our short theme debugging instructions.
    Please read the FAQs: Mantra • Nirvana • Parabola • Tempera
    Tutorials: custom menus • translating theme • installing theme • category page with intro • disabling comments Wordpress: child themes • categories/posts
    Before making any modifications to your theme we strongly recommend using Child Themes.
  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘Not fully responsive – certain browsers’ is closed to new replies.