Title: html width in iOS version Last modified: August 22, 2016 --- # html width in iOS version * [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years, 5 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/) * Hello, * I’m testing mobile version (iOS 8) of my site – [http://ouroboros.marconoris.com/](http://ouroboros.marconoris.com/)– and sometimes the width of the page don’t fit the screen. The same occurs testing media query in Chrome (Windows) with inspector: still white space at the right of the page. I removed all few custom css but still the same. * [Here the screenshot](https://www.dropbox.com/s/90ufk70i5od8zwb/2014-11-22%2020.06.31.png?dl=0). * Thanks 🙂 Marco Viewing 15 replies - 1 through 15 (of 20 total) 1 [2](https://wordpress.org/support/topic/html-width-in-ios-version/page/2/?output_format=md) [→](https://wordpress.org/support/topic/html-width-in-ios-version/page/2/?output_format=md) * Moderator [Kathryn Presner](https://wordpress.org/support/users/zoonini/) * (@zoonini) * [11 years, 5 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508357) * Hi Marco, I’m not seeing that gap in Safari on iPhone 5s / iOS 8.1.1 so I’d like to ask some troubleshooting questions: * Do you see the gap when logged out of your site? * Is the screenshot taken on the homepage? If not, could you provide the specific link? * What exact version of iOS are you running, is it 8.1.1? * What browser are you using? * Thread Starter [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years, 5 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508383) * Hi Kathryn, * Yes, the gap was logged out and logged in too; the screenshot is on the homepage and yes, my iOS is 8.1.1. * I partially solved issue changing the meta viewport to ``. Still a horizontal movement but isn’t important, the gap is gone 🙂 There is something strange in media query I guess, but it’s a common problem in wordpress responsive themes. In this case, theme that works perfectly in mobile version is Water Lily: [http://www.marconoris.com/](http://www.marconoris.com/). * Thank you! * Moderator [Kathryn Presner](https://wordpress.org/support/users/zoonini/) * (@zoonini) * [11 years, 5 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508397) * Thanks for providing your fix. I’d like to ideally get to the bottom of this so I can report this to our developers, so I’d like to ask you a few more troubleshooting questions so we can attempt to replicate: * Were you using Safari or a different browser? * What type of device are you using? i.e. iPhone 5s, iPhone 6 Plus, iPad Air, etc. * Do you see the same issue on the Syntax demo sites: * [http://syntaxdemo.wordpress.com/](http://syntaxdemo.wordpress.com/) * [http://wp-themes.com/syntax/](http://wp-themes.com/syntax/) * Thanks for your help. * Thread Starter [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years, 5 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508400) * I’m using Safari on iPhone 5s, iOS 8.1.1. * I see a big gap in [http://wp-themes.com/syntax/](http://wp-themes.com/syntax/) but the version on [http://syntaxdemo.wordpress.com/](http://syntaxdemo.wordpress.com/) is perfect, without any horizontal shift! * Thank you too. * Moderator [Kathryn Presner](https://wordpress.org/support/users/zoonini/) * (@zoonini) * [11 years, 5 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508438) * Thanks for testing the demos. * I’m seeing the gap on [http://wp-themes.com/syntax/](http://wp-themes.com/syntax/) on my iPhone 5s as well, so I’m going to report this to our developers so they can investigate. We’ll keep you posted here. * [stylep](https://wordpress.org/support/users/stylep/) * (@stylep) * [11 years, 1 month ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508546) * Ouroboros, I’m having the same issue that you had here. I see you solved [this problem](https://www.dropbox.com/s/90ufk70i5od8zwb/2014-11-22%2020.06.31.png?dl=0) because if I now go to your site ([http://ouroboros.marconoris.com/](http://ouroboros.marconoris.com/)), I don’t see the horizontal scroller. How did you get rid of that? * Thread Starter [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years, 1 month ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508551) * Hei Stylep, * I removed the horizontal scroller using this meta in header.php * `` * (if I remember correctly replacing the default one) and putting this class in my custom CSS: * `html {overflow-x: auto;}` * I hope this helps! * [stylep](https://wordpress.org/support/users/stylep/) * (@stylep) * [11 years, 1 month ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508552) * Thanks a lot! One more question, how do you add that class to the CSS file? Or is there a place in the theme to simply add custom CSS? * Thread Starter [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508553) * Yes, there is a place in WordPress left column admin menu, under “appearance” > “edit CSS”. * [stylep](https://wordpress.org/support/users/stylep/) * (@stylep) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508554) * Hi! Are you referring to editing the style.css file? If yes, where should I add that custom class in the CSS? Thank you! * Thread Starter [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508555) * Hi 🙂 * i’m sorry i forgot, you have to install Jetpack plugin to activate a custom css under “Appearance > edit CSS” menu. if you don’t know CSS maybe it’s the best solution. * [stylep](https://wordpress.org/support/users/stylep/) * (@stylep) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508556) * Ohh! That explains why I didn’t find it. Thank you so much! * [stylep](https://wordpress.org/support/users/stylep/) * (@stylep) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508557) * It’s pretty annoying, but even after activating the Jetpack plugin and adding that custom CSS, the horizontal scroller is still visible on my site… I replaced the viewport in the header.php too like you said. Very disturbing. * Thread Starter [Ouroboros](https://wordpress.org/support/users/ouroboros/) * (@ouroboros) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508558) * Can you post the address of your site? * [stylep](https://wordpress.org/support/users/stylep/) * (@stylep) * [11 years ago](https://wordpress.org/support/topic/html-width-in-ios-version/#post-5508559) * Sure, it’s [here](http://patrikmisko.com). Viewing 15 replies - 1 through 15 (of 20 total) 1 [2](https://wordpress.org/support/topic/html-width-in-ios-version/page/2/?output_format=md) [→](https://wordpress.org/support/topic/html-width-in-ios-version/page/2/?output_format=md) The topic ‘html width in iOS version’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/syntax/1.1.0/screenshot.png) * Syntax * [Support Threads](https://wordpress.org/support/theme/syntax/) * [Active Topics](https://wordpress.org/support/theme/syntax/active/) * [Unresolved Topics](https://wordpress.org/support/theme/syntax/unresolved/) * [Reviews](https://wordpress.org/support/theme/syntax/reviews/) ## Tags * [media query](https://wordpress.org/support/topic-tag/media-query/) * 20 replies * 4 participants * Last reply from: [Kathryn Presner](https://wordpress.org/support/users/zoonini/) * Last activity: [10 years, 10 months ago](https://wordpress.org/support/topic/html-width-in-ios-version/page/2/#post-5508565) * Status: not resolved