Re: [css-d] @media handheld?
On 10/24/11 1:12 AM, Ghodmode wrote: Every browser I tested shows screen. I was hoping for it to say handheld and screen, or just handheld. The use of min-width, max-width, width, and fluid images, will yield any desktop, laptop or tablet [landscape or portrait] window without any media query. One 480 media query will handle most any mobile-handset in portrait and landscape view. You'll need an appropriate device meta tag such as metaname=viewport content=width=device-width. Btw, I have Opera Mini, and Opera Mobile, running without issue on a low-end Android/2.2.2. Best, Bono 4 U2 -- Desktop. Laptop. Tablet. Mobile! http://chelseacreekstudio.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] :: ie/7 xp/vista ::
On 10/23/11 7:41 PM, David Laakso wrote: Problematic viewing IE/7 at the moment here in Havana. Confirmation appreciated. In IE/7.0 in tn left-column in the vertical word Journal the letter J should be white knocked-out of a black box and the bottom of the J should not be clipped. markup http://chelseacreekstudio.com/site/journal/index.php Resolved. http://home.browsercam.com/public.aspx?proj_id=567793 Oh Happy Day! http://www.youtube.com/watch?v=a37bBm8pXSk Best, Milagros Havana -- Desktop. Laptop. Tablet. Mobile! http://chelseacreekstudio.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] San-Check request on new responsive site(s)
Would appreciate a quick check/feedback on my first forays into responsive web development. http://korea.gallup.com (very basic small site, being used to test out concepts) http://strengths.gallup.com (slightly larger, but still small site ... more complexity of forms and navigation) We test against IE7+, Firefox 3.5+, Safari (mac), Chrome on desktop. Only got very rough insight into device testing since my dev environment has no true mobile devices with access, only emulators. These are my testbed sites in preparation for a large scale site redesign of our primary external consumer website in January. I've already found a few 'things that are not so hot' but would very much value any and all feedback. Elizabeth Davies System Application Developer Input | Intellection | Learner | Achiever | Belief _ GALLUP TECHNOLOGY 1001 Gallup Drive, Omaha, NE 68102 402-938-6123 IMPORTANT NOTICE: This e-mail message and all attachments, if any, may contain confidential and privileged material and are intended only for the person or entity to which the message is addressed. If you are not an intended recipient, you are hereby notified that any use, dissemination, distribution, disclosure, or copying of this information is unauthorized and strictly prohibited. If you have received this communication in error, please contact the sender immediately by reply e-mail, and destroy all copies of the original message. __ 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] San-Check request on new responsive site(s)
On Mon, 24 Oct 2011, Davies, Elizabeth wrote: Would appreciate a quick check/feedback on my first forays into responsive web development. http://korea.gallup.com (very basic small site, being used to test out concepts) http://strengths.gallup.com (slightly larger, but still small site ... more complexity of forms and navigation) We test against IE7+, Firefox 3.5+, Safari (mac), Chrome on desktop. Only got very rough insight into device testing since my dev environment has no true mobile devices with access, only emulators. These are my testbed sites in preparation for a large scale site redesign of our primary external consumer website in January. I've already found a few 'things that are not so hot' but would very much value any and all feedback. Text spills out of its container: http://b.cfaj.ca/gallup.jpg -- Chris F.A. Johnson, http://cfajohnson.com/ Author: Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress) Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress) __ 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] San-Check request on new responsive site(s)
On 10/24/11 12:04 PM, Davies, Elizabeth wrote: Would appreciate a quick check/feedback on my first forays into responsive web development. http://korea.gallup.com (very basic small site, being used to test out concepts) Page throws an horizontal scroll bar regardless of screen resolution. She looks O.K [other than above] for landscape [1024] and portrait [768] view tablets. Folding to one column nicely at 640 and holding same at 600 and 480 mobile. No h-scroll bar Android/2.2.2 portrait/landscape [a low-end smart phone]. Text a bit tiny and insufficient line-height. Image placeholders adjacent to Chinese text. Opera Mobile and Opera Mini running on same handset yield pretty much same result as Androiud /2.2.2 I don't have IE 7/8/9 right now but these captures look as though you are getting left column float-drop? http://home.browsercam.com/public.aspx?proj_id=567849 aside The tiny type and insufficient contrast verges on being unreadable on landing on a MacBookPro at 116.5dpi/1680 and will be worse in high-end laptops at120 and 130dpi [try setting it at 100%[user default] or 102% and drop to no less than 100%[user default] at 480 mobile. /aside I did not have time to look at the more complex version. Elizabeth Davies Best, Milagross Sanchez Bogota, Colombia PS If Gallup can't afford a few real mobile handsets to test on, then we're all hopelessly lost :-) ? -- Desktop. Laptop. Tablet. Mobile! http://chelseacreekstudio.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] Banners
Can anyone recommend some good tutorials on how to make web banners using CSS? Thank you! John __ 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] San-Check request on new responsive site(s)
Many thanks David. Great feedback. I get the horizontal expansion or scroll bar on the iPad in horizontal orientation where it zooms in on the rotation. It 'finds itself' if you snap it. Will have to explore why it does that, possibly layer in a viewport media query just for Mac devices. The Android pads don't seem to have that issue, although the top nav dropdown blows chunks on Android phones. The image placeholders were caused by a major outage from Onstream hosting services that slammed all of our websites at the exact time you were testing. There be some rabid scrambling going on across the 'net over that one. Fluid images lose their wow factor when there is no image. Text size and line height ... thanks for the verification. I can now go whinge louder at the designers. They just tell me I'm half blind (which is also true). Hadn't considered the higher dpi displays. Again, great feedback. (And Gallup can afford phones and devices. Sadly there's this thing called NIST and our environment is locked down tight. Last year I had devices. Today I have emulators and educated guesses as they investigate ways to let us test locally on mobile again.) Elizabeth IMPORTANT NOTICE: This e-mail message and all attachments, if any, may contain confidential and privileged material and are intended only for the person or entity to which the message is addressed. If you are not an intended recipient, you are hereby notified that any use, dissemination, distribution, disclosure, or copying of this information is unauthorized and strictly prohibited. If you have received this communication in error, please contact the sender immediately by reply e-mail, and destroy all copies of the original message. __ 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] Container shifts, one page to another
http://coffeeonmars.com/testing/index.html http://coffeeonmars.com/testing/WPR_Wire.html When I load the two links above and go from one tab to the other, I see the content area shift to the left (going from the index page to the wpr_wire page) the only browswer that doesn't do this is Win IE 6, but Win FF 7 does, Win Opera 11.51 does , as do Mac Safari 5, FF 6 and Opera 11.50 can anyone see why this shift happens? my hunch is that it has to do with the image on the second page, though I'm pretty sure its well within the bounds of the area it's sitting in. thank you in advance, John __ 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] Container shifts, one page to another
El 25/10/2011, a las 00:11, John escribió: http://coffeeonmars.com/testing/index.html http://coffeeonmars.com/testing/WPR_Wire.html When I load the two links above and go from one tab to the other, I see the content area shift to the left (going from the index page to the wpr_wire page) the only browswer that doesn't do this is Win IE 6, but Win FF 7 does, Win Opera 11.51 does , as do Mac Safari 5, FF 6 and Opera 11.50 can anyone see why this shift happens? my hunch is that it has to do with the image on the second page, though I'm pretty sure its well within the bounds of the area it's sitting in. Could it be just that the 2nd page draws a scroll bar, which causes everything to shift to the left ? Hth, best regards, Peter H. __ 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] Container shifts, one page to another
On 10/24/11 6:11 PM, John wrote:
http://coffeeonmars.com/testing/index.html
http://coffeeonmars.com/testing/WPR_Wire.html
When I load the two links above and go from one tab to the other, I see the
content area shift to the left (going from the index page to the wpr_wire page)
John
See short page shift---
http://www.communitymx.com/content/article.cfm?cid=528a0
One fix is to force a scrollbar
html { min-height: 100%; margin-bottom: 1px; }
~d
--
Desktop. Laptop. Tablet. Mobile!
http://chelseacreekstudio.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] Container shifts, one page to another
On Oct 24, 2011, at 3:52 PM, David Laakso wrote:
See short page shift---
http://www.communitymx.com/content/article.cfm?cid=528a0
One fix is to force a scrollbar
html { min-height: 100%; margin-bottom: 1px; }
~d
FINALLY! A dumb problem I didn't cause!
this was sorta cool while reading the article you linked, David, I was able to
prove the short page phenomenon by simply making the browser window taller on
the offending page then tabbing back and forth between the two...page shift
gone...
thank you,
John
__
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] Container shifts, one page to another
On Oct 24, 2011, at 3:52 PM, David Laakso wrote:
See short page shift---
http://www.communitymx.com/content/article.cfm?cid=528a0
One fix is to force a scrollbar
html { min-height: 100%; margin-bottom: 1px; }
~d
OK..for my page, inserting margin-bottom: 1px resulted in about a 10-pixel gap
between the top of my container and the top of the browser window, so I
ammended the code to:
margin: 0 0 1px 0; which appeared to fix that problem.
Was this the right way to deal with that gap cause by using just margin-bottom:
1px; ?
John
__
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] Container shifts, one page to another
HTML{overflow-y: scroll;} is another option
Sent from iOS 5
On Oct 24, 2011, at 7:38 PM, John j...@coffeeonmars.com wrote:
On Oct 24, 2011, at 3:52 PM, David Laakso wrote:
See short page shift---
http://www.communitymx.com/content/article.cfm?cid=528a0
One fix is to force a scrollbar
html { min-height: 100%; margin-bottom: 1px; }
~d
OK..for my page, inserting margin-bottom: 1px resulted in about a 10-pixel
gap between the top of my container and the top of the browser window, so I
ammended the code to:
margin: 0 0 1px 0; which appeared to fix that problem.
Was this the right way to deal with that gap cause by using just
margin-bottom: 1px; ?
John
__
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] Container shifts, one page to another
On Oct 24, 2011, at 4:38 PM, John wrote:
On Oct 24, 2011, at 3:52 PM, David Laakso wrote:
See short page shift---
http://www.communitymx.com/content/article.cfm?cid=528a0
One fix is to force a scrollbar
html { min-height: 100%; margin-bottom: 1px; }
~d
OK..for my page, inserting margin-bottom: 1px resulted in about a 10-pixel
gap between the top of my container and the top of the browser window, so I
ammended the code to: margin: 0 0 1px 0; which appeared to fix that
problem. Was this the right way to deal with that gap cause by using just
margin-bottom: 1px; ?John
With the new code bit in place, it doesn't seem to be forcing a scrollbar in
the page that doesn't need it (so that page shift doesn't happen). I can easily
open the browser so that the first page has no scrollbar, the second does.
thanks!
J
__
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] Container shifts, one page to another
On Oct 24, 2011, at 4:47 PM, Tom Livingston wrote:
HTML{overflow-y: scroll;} is another option
Sent from iOS 5
that does work...thank you, Tom.
John
__
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] Container shifts, one page to another
On Oct 24, 2011, at 3:52 PM, David Laakso wrote:
One fix is to force a scrollbar
html { min-height: 100%; margin-bottom: 1px; }
OK..got this one to work, too...I put the code in the wrong spot.
thank you!
John
__
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] San-Check request on new responsive site(s)
On Oct 25, 2011, at 3:26 AM, David Laakso wrote: http://korea.gallup.com (very basic small site, being used to test out concepts) Page throws an horizontal scroll bar regardless of screen resolution. That scrollbar is caused by the box-shadow on the header. Will be visible on Safari 5 (but not 5.1) and older, Gecko 1.9.2 and older, iOS 4.3 (but not iOS 5), Opera 11.5 and older. The platform doesn't matter. Philippe -- Philippe Wittenbergh http://l-c-n.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] Banners
Do you mean like headers? Or do you mean like banners for advertisements? Or other? Sincerely, Michael http://whatiscss.michaelfokken.com/ On Mon, Oct 24, 2011 at 1:03 PM, John j...@coffeeonmars.com wrote: Can anyone recommend some good tutorials on how to make web banners using CSS? __ 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/
