Hi I am having some trouble with my website on iphones and my android phone I seem to have a massive white space on the right of my website The container etc seems to stop but get a big white space on the right Any ideas please help, been trying to figure it out for a while now lol The website is www.irhwebsites.com Kind regards Ian
You have an inaccessible fixed width layout with design elements not suited to mobile. What you need is a responsive layout, which is an entirely different way of building a website. The site is filled with accessibility failings - from the inaccessible fixed metric (px) fonts, to the fixed width layout, to design elements like the massive banner, to illegible color contrasts on links and fixed heights on color backgrounds that look more like rendering errors than intentional design. The code is also problematic (or as I often call it, rubbish). From the HTML 5 elements and stupid malfing shiv javascript garbage in a non-HTML 5 document, HTML 3.2 style code in a STRICT document, overstuffed and pointlessly redundant meta[keywords], lack of media targets on the CSS <LINK>s, invalid/nonexistant values in the meta[robots], jquery for NOTHING, pointless extra wrapping DIV for **** knows what, clearing breaks like it's still 2001, gibberish/nonsensical use of numbered headings, deprecated attributes like TARGET that have no business in any code written after 1997, paragraphs around non-paragraph content, pointless use of the TITLE attribute just bloating out the markup, COMMENT placements that could be tripping rendering errors in IE and some versions of FF (Yes, I said COMMENTS tripping errors), abuse of STRONG around elements I see no reason to be recieving "More emphasis" (Likely to get the site slapped down for abuse by the search engines), etc, etc, etc... and that's just the markup. The multiple stylesheets increasing the handshakes for no good reason, stupid reset changing values that don't need changing (or even broken changes! We can thank Eric Meyer for that asshattery), presentational classes (blue_text, bold_text... REALLY?!?), image replacement method (the stupid malfing text-indent:-9999px) that defeats the entire point of image replacement (images off appearance/content), px metric font declarations on damned near everything... It's a laundry list of how not to build a website. Even stranger is you appear to have an attempt at using media queries -- but if those are doing anything I'm sure as shine-ola not seeing it. I would throw that entire mess away and start over with semantic markup that actually matches your chosen document (XHTML 1.0 STRICT is fine), practicing actual separation of presentation from content and an ACTUAL responsive layout, using elements that are actually conducive to responsive design. There is very little I would retain from your current version.