WordPress.org

Ready to get started?Download WordPress

Forums

Optimize Site For all Resolutions (6 posts)

  1. classadesign@gmail.com
    Member
    Posted 2 years ago #

    I am currently developing some wordpress websites and have encountered a problem when the site is viewed in different resolutions.

    The site views absolutely fine on my screen 1366x768 but when I view site on an older 'square monitors' the header is cut off and some of the columns realign so content appears below where it should be.

    I have tried to search the internet high and low and cant seem to find any solutions to this, so please any help or direction on this matter would be hugely appreciated.

    here is the link for site

    http://www.heritagebuildingservices.co.uk

  2. shirazdrum
    Member
    Posted 2 years ago #

    Your header image is a repeating background image and it's larger than the width of the rest of the site. That's your problem. Also 990px with is going to cause problems on old square monitors, max would be 980px and that's pushing it.

  3. classadesign@gmail.com
    Member
    Posted 2 years ago #

    Thanks for your speedy reply Shirazdrum!

    How do I change the px size to a suitable size across whole site?

    What size would you reccomend?

    The header is an imported image from photoshop but from looking at all the setting the image in not repeated just one image!

    Thanks for your help

  4. classadesign@gmail.com
    Member
    Posted 2 years ago #

    The theme used is options by the way just so you know.

  5. shirazdrum
    Member
    Posted 2 years ago #

    Yes it is a repeating image. This is what you have you CSS file:

    background: rgba(10, 80, 56, 0.9) url(http://108.167.155.56/~heritage/wp-content/uploads/2012/07/header14.png);

    Change that to:

    background: rgba(10, 80, 56, 0.9) url(http://108.167.155.56/~heritage/wp-content/uploads/2012/07/header14.png) top center no-repeat;

    And edit the image to the width of your site: as of right now, the image is 1349px wide.

  6. classadesign@gmail.com
    Member
    Posted 2 years ago #

    Ok which CSS template would I find that coding on?

Topic Closed

This topic has been closed to new replies.

About this Topic