[css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480
I've been rolling out responsive layouts for my site, but iPhone is giving me trouble. My iPhone 4 reports its portrait resolution as 320 x 480px. At this size I'm getting horizontal scrollbars. This also happens in Chrome if I resize the browser to these dimensions. I've spent hours in the Chrome inspector mucking with my widths and margins and I can't find where it's coming from. Site in question: http://quibble.it/ Can anyone help with this? Thanks, Jeff __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480
On Fri, May 24, 2013 at 1:01 PM, Jeff Emminger jemmin...@gmail.com wrote:
I've been rolling out responsive layouts for my site, but iPhone is giving
me trouble. My iPhone 4 reports its portrait resolution as 320 x 480px.
At this size I'm getting horizontal scrollbars. This also happens in
Chrome if I resize the browser to these dimensions.
I've spent hours in the Chrome inspector mucking with my widths and margins
and I can't find where it's coming from.
Site in question: http://quibble.it/
Can anyone help with this?
Thanks,
Jeff
__
Hi Jeff,
I have encountered this a few times. It's a pain.
I see on #hero.container item you have a fixed width specified of
300px (@max-width 400px). This may be causing a math issue where
things inside are adding up to more than 300px.
Also, are you using box-sizing anywhere?
div, header, aside, footer, input, textarea {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box; }
This might help with box-model issues.
And, sadly, i've used overflow:hidden; on the body once or twice due
to crazy time constraints and the inability to spend time tracking the
culprit down.
HTH
--
Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Supporting Retina Images
List, Does anyone have any good resources on supporting 2x images (Retina)? A 'how-to' would be good as well as I have not yet done this. Also, DO YOU support Retina/2x images in your web work?? Thanks! -- Tom Livingston | Senior Front-End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480
I found it! Used the 3D view in Firefox, and I found a nearly invisible divider towards the bottom that was fixed at 359px. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480
Perhaps a line of css like this might cure it: overflow: hidden; There are disadvantages of this but try anyway. Date: Fri, 24 May 2013 13:01:05 -0400 From: jemmin...@gmail.com To: css-d@lists.css-discuss.org Subject: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480 I've been rolling out responsive layouts for my site, but iPhone is giving me trouble. My iPhone 4 reports its portrait resolution as 320 x 480px. At this size I'm getting horizontal scrollbars. This also happens in Chrome if I resize the browser to these dimensions. I've spent hours in the Chrome inspector mucking with my widths and margins and I can't find where it's coming from. Site in question: http://quibble.it/ Can anyone help with this? Thanks, Jeff __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480
Hmm. 3D view in FF. I'll have to remember that one! On Fri, May 24, 2013 at 3:30 PM, John D xfs...@hotmail.com wrote: Perhaps a line of css like this might cure it: overflow: hidden; There are disadvantages of this but try anyway. Date: Fri, 24 May 2013 13:01:05 -0400 From: jemmin...@gmail.com To: css-d@lists.css-discuss.org Subject: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480 I've been rolling out responsive layouts for my site, but iPhone is giving me trouble. My iPhone 4 reports its portrait resolution as 320 x 480px. At this size I'm getting horizontal scrollbars. This also happens in Chrome if I resize the browser to these dimensions. I've spent hours in the Chrome inspector mucking with my widths and margins and I can't find where it's coming from. Site in question: http://quibble.it/ Can anyone help with this? Thanks, Jeff __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- Tom Livingston | Senior Front-End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Fwd: Can't get rid of horizontal scrollbars in 320x480
On Fri, May 24, 2013 at 3:40 PM, Tom Livingston tom...@gmail.com wrote: Hmm. 3D view in FF. I'll have to remember that one! Yeah, I thought it was pretty gimmicky when I first saw it a few years ago. Then it saved my butt when I thought to use it more recently to diagnose another project's css. Glad I remembered this time too :) __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] ★ Css D, Mark left a message for you
Mark left a message for you Its sender and content will be shown only to you and you can delete it at any time. You can instantly reply to it, using the message exchange system. To find out what was written to you, just follow this link: http://us1.badoo.com/01240387663/in/k87JyQdV4z4/?lang_id=3g=57m=21mid=51a03fbb000301b0acbb0216714100a9 If clicking the links in this message does not work, copy and paste them into the address bar of your browser. This email is a part of delivering a message sent by Mark on the system. If you received this email by mistake, please just ignore it. After a short time the message will be removed from the system. Have fun! The Badoo Team You have received this email from Badoo Trading Limited (postal address below). http://us1.badoo.com/impersonation.phtml?lang_id=3email=css-d%40lists.css-discuss.orgblock_code=94652fm=21mid=51a03fbb000301b0acbb0216714100a9 Badoo Trading Limited is a limited company registered in England and Wales under CRN 7540255 with its registered office at Media Village, 131 - 151 Great Titchfield Street, London, W1W 5BB. __ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
