Re: [css-d] site review: hydrogeologist
I believe content is king and should precede navigation in the html. ... unless you're using a screen reader, then you'll need to go to the bottom of the page to access the navigation. This is why they have skip links. As for the long words not wrapping, why not use: word-wrap: break-word; Greg -Original Message- From: David Laakso [mailto:laakso.davi...@gmail.com] Sent: Tuesday, July 09, 2013 5:59 PM To: CSS Discuss Cc: Greg Gamble Subject: Re: [css-d] site review: hydrogeologist On Tue, Jul 9, 2013 at 6:36 PM, Greg Gamble ggam...@sbctc.edu wrote: Curious on why you placed the Navigation at the bottom of the page? I believe content is king and should precede navigation in the html. Also, why are you using all of the soft hyphens ... #x00ad; ? Not all of them are necessary but primarily because font-scaling in mobile hand-sets causes long words to break the outermost containing block [producing horizontal page wiggle ]. In plain English one has to scroll both horizontally and vertically to read the text. And using -moz-hyphens:auto;-ms-hyphens:auto;-o;webkit-hyphens:auto;hyphens:auto; is not even close to being ready for prime-time. Best, David Laakso __ 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] site review: hydrogeologist
Le 11 juil. 2013 à 22:54, Greg Gamble ggam...@sbctc.edu a écrit : As for the long words not wrapping, why not use: word-wrap: break-word; That is a horrible solution in general for 'western' text as it breaks words at any arbitrary point, without respect for grammar and word-breaking rules; it might work in very controlled environments, eventually. Or for 'western' text strings embedded inside CJK text. http://dev.w3.org/csswg/css-text/#word-break 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] site review: hydrogeologist
I wouldn't say its horrible, but you are correct in where the breaks happen, if they happen. It's usually not an issue if your container is sized to fit the text. And what is Western text embedded inside CJK text? Greg -Original Message- From: Philippe Wittenbergh [mailto:e...@l-c-n.com] Sent: Thursday, July 11, 2013 7:02 AM To: Greg Gamble Cc: CSS Discuss Subject: Re: [css-d] site review: hydrogeologist Le 11 juil. 2013 à 22:54, Greg Gamble ggam...@sbctc.edu a écrit : As for the long words not wrapping, why not use: word-wrap: break-word; That is a horrible solution in general for 'western' text as it breaks words at any arbitrary point, without respect for grammar and word-breaking rules; it might work in very controlled environments, eventually. Or for 'western' text strings embedded inside CJK text. http://dev.w3.org/csswg/css-text/#word-break 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] site review: hydrogeologist
On Thu, Jul 11, 2013 at 10:37 AM, Greg Gamble ggam...@sbctc.edu wrote: And what is Western text embedded inside CJK text? Greg Chinese, Japanese, and Korean. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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] site review: hydrogeologist
Works good on the desktop, but now on my iPhone the shaded buttons dont appear, it just stretches the flat buttons to the width of the landscape. FYI. But it doesn't look bad. Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 10, 2013, at 12:54 AM, David Laakso wrote: On Tue, Jul 9, 2013 at 10:57 PM, Philippe Wittenbergh e...@l-c-n.com wrote: Le 10 juil. 2013 à 04:46, Karl DeSaulniers k...@designdrumm.com a écrit : Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. It is a bug in Safari 6.0x and the equivalent Mobile Safari on iOS 6.x (and maybe older versions of Safari, haven't tested). That is fixed in Safari.next. I think toggling between 'block' and 'inline-block' on the li instead of the b and a kids will work better. Keep the latter two as 'block' the whole time. Philippe re: http://ccstudi.com/rum/ Bingo! That's the ticket to ride. Thank you, Philippe. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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-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] site review: hydrogeologist
Constructive comments and suggestions on this responsive layout appreciated. http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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] site review: hydrogeologist
Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. Best, Karl Sent from losPhone On Jul 9, 2013, at 1:53 PM, David Laakso laakso.davi...@gmail.com wrote: Constructive comments and suggestions on this responsive layout appreciated. http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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-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] site review: hydrogeologist
Same on chrome for iPhone. Best, Karl Sent from losPhone On Jul 9, 2013, at 2:46 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. Best, Karl Sent from losPhone On Jul 9, 2013, at 1:53 PM, David Laakso laakso.davi...@gmail.com wrote: Constructive comments and suggestions on this responsive layout appreciated. http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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-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] site review: hydrogeologist
No skip links Heading tags are not in order. You start with an H2, go to an H1, then to an H5 and an H6. Alt tags for images are empty. Do the images have meaning, or are they used for filler? Same image in multiple locations on the same page. Hovering over a link shows a line above the link text, which can be confusing. Looks ok on a Nokia Lumia 928 w/WP8 using IE10 and UC Browser. Greg -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of David Laakso Sent: Tuesday, July 09, 2013 11:53 AM To: CSS Discuss Subject: [css-d] site review: hydrogeologist Constructive comments and suggestions on this responsive layout appreciated. http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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-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] site review: hydrogeologist
On Tue, Jul 9, 2013 at 3:46 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. Best, Karl http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Karl, overlap not seen [behaves as intended] when rotating from portrait to landscape in this particular iPhone 5 simulator http://iphone5simulator.com/ . However, what one gets on a simulator dose not always match what one sees on an actual device. Anyone else see the problem Karl wrote about on iPhone 5 and/or have a fix for same? Note that the nav is the last item in the html source and is absolute positioned in the css to the top of the page; consequently, there may in fact be some overlap in some small screen devices. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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] site review: hydrogeologist
Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:14 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 3:46 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. Best, Karl http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Karl, overlap not seen [behaves as intended] when rotating from portrait to landscape in this particular iPhone 5 simulator http://iphone5simulator.com/ . However, what one gets on a simulator dose not always match what one sees on an actual device. Anyone else see the problem Karl wrote about on iPhone 5 and/or have a fix for same? Note that the nav is the last item in the html source and is absolute positioned in the css to the top of the page; consequently, there may in fact be some overlap in some small screen devices. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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] site review: hydrogeologist
iOS 6.1.4 - build 10B350 using safari and chrome does same thing. Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:35 PM, Karl DeSaulniers wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:14 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 3:46 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. Best, Karl http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Karl, overlap not seen [behaves as intended] when rotating from portrait to landscape in this particular iPhone 5 simulator http://iphone5simulator.com/ . However, what one gets on a simulator dose not always match what one sees on an actual device. Anyone else see the problem Karl wrote about on iPhone 5 and/or have a fix for same? Note that the nav is the last item in the html source and is absolute positioned in the css to the top of the page; consequently, there may in fact be some overlap in some small screen devices. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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-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] site review: hydrogeologist
On Tue, Jul 9, 2013 at 5:35 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers re: http://ccstudi.com/rum/ Thanks for the screen shots. I have modified the CSS. Please open in iPhone 5 portrait mode. Rotate to landscape. Reload the device or tap any of the three bunched up links. Does iPhone 5 landscape recover, now? Thanks Karl. Best, David Laakso __ 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] site review: hydrogeologist
Yes and no. If I load the page as landscape they work, but if I load the page as portrait and then go to landscape they dont. maybe try a diplay:inline instead of block on the ul Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:59 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 5:35 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers re: http://ccstudi.com/rum/ Thanks for the screen shots. I have modified the CSS. Please open in iPhone 5 portrait mode. Rotate to landscape. Reload the device or tap any of the three bunched up links. Does iPhone 5 landscape recover, now? Thanks Karl. Best, David Laakso __ 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] site review: hydrogeologist
Or a display: list-item? Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:10 PM, Karl DeSaulniers wrote: Or a display: list-item? On Jul 9, 2013, at 5:06 PM, Karl DeSaulniers wrote: Yes and no. If I load the page as landscape they work, but if I load the page as portrait and then go to landscape they dont. maybe try a diplay:inline instead of block on the ul Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:59 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 5:35 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers re: http://ccstudi.com/rum/ Thanks for the screen shots. I have modified the CSS. Please open in iPhone 5 portrait mode. Rotate to landscape. Reload the device or tap any of the three bunched up links. Does iPhone 5 landscape recover, now? Thanks Karl. Best, David Laakso __ 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/ __ 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] site review: hydrogeologist
Same thing happens in safari on my desktop if I grab the right side of the browser and shrink the browser window. display: list-tiem on the ul element fixed it for me with inspect element on my desktop. HTH, Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:11 PM, Karl DeSaulniers wrote: Or a display: list-item? Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:10 PM, Karl DeSaulniers wrote: Or a display: list-item? On Jul 9, 2013, at 5:06 PM, Karl DeSaulniers wrote: Yes and no. If I load the page as landscape they work, but if I load the page as portrait and then go to landscape they dont. maybe try a diplay:inline instead of block on the ul Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:59 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 5:35 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers re: http://ccstudi.com/rum/ Thanks for the screen shots. I have modified the CSS. Please open in iPhone 5 portrait mode. Rotate to landscape. Reload the device or tap any of the three bunched up links. Does iPhone 5 landscape recover, now? Thanks Karl. Best, David Laakso __ 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/ __ 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] site review: hydrogeologist
Curious on why you placed the Navigation at the bottom of the page? Also, why are you using all of the soft hyphens ... #x00ad; ? Greg -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of David Laakso Sent: Tuesday, July 09, 2013 2:14 PM To: CSS Discuss Cc: Karl DeSaulniers Subject: Re: [css-d] site review: hydrogeologist On Tue, Jul 9, 2013 at 3:46 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. Best, Karl http://ccstudi.com/rum/ css http://ccstudi.com/rum/r/r.css Karl, overlap not seen [behaves as intended] when rotating from portrait to landscape in this particular iPhone 5 simulator http://iphone5simulator.com/ . However, what one gets on a simulator dose not always match what one sees on an actual device. Anyone else see the problem Karl wrote about on iPhone 5 and/or have a fix for same? Note that the nav is the last item in the html source and is absolute positioned in the css to the top of the page; consequently, there may in fact be some overlap in some small screen devices. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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-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] site review: hydrogeologist
Also might want to add to the ul element list-style-type: none; a dics is showing on safari on my desktop Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:15 PM, Karl DeSaulniers wrote: Same thing happens in safari on my desktop if I grab the right side of the browser and shrink the browser window. display: list-tiem on the ul element fixed it for me with inspect element on my desktop. HTH, Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:11 PM, Karl DeSaulniers wrote: Or a display: list-item? Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:10 PM, Karl DeSaulniers wrote: Or a display: list-item? On Jul 9, 2013, at 5:06 PM, Karl DeSaulniers wrote: Yes and no. If I load the page as landscape they work, but if I load the page as portrait and then go to landscape they dont. maybe try a diplay:inline instead of block on the ul Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:59 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 5:35 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers re: http://ccstudi.com/rum/ Thanks for the screen shots. I have modified the CSS. Please open in iPhone 5 portrait mode. Rotate to landscape. Reload the device or tap any of the three bunched up links. Does iPhone 5 landscape recover, now? Thanks Karl. Best, David Laakso __ 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/ __ 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/ __ 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] site review: hydrogeologist
Also, if I might suggest on the nav links, placing at least one more space or padding on each side of the text inside the buttons with the shaded backgrounds. The text looks a little crammed in there. But not entirely necessary. Just my opinion. :) Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:35 PM, Karl DeSaulniers wrote: Also might want to add to the ul element list-style-type: none; a dics is showing on safari on my desktop Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:15 PM, Karl DeSaulniers wrote: Same thing happens in safari on my desktop if I grab the right side of the browser and shrink the browser window. display: list-tiem on the ul element fixed it for me with inspect element on my desktop. HTH, Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:11 PM, Karl DeSaulniers wrote: Or a display: list-item? Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 5:10 PM, Karl DeSaulniers wrote: Or a display: list-item? On Jul 9, 2013, at 5:06 PM, Karl DeSaulniers wrote: Yes and no. If I load the page as landscape they work, but if I load the page as portrait and then go to landscape they dont. maybe try a diplay:inline instead of block on the ul Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 4:59 PM, David Laakso wrote: On Tue, Jul 9, 2013 at 5:35 PM, Karl DeSaulniers k...@designdrumm.com wrote: Take a look.. http://designdrumm.com/IMG_0164.PNG HTH, Best, Karl DeSaulniers re: http://ccstudi.com/rum/ Thanks for the screen shots. I have modified the CSS. Please open in iPhone 5 portrait mode. Rotate to landscape. Reload the device or tap any of the three bunched up links. Does iPhone 5 landscape recover, now? Thanks Karl. Best, David Laakso __ 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/ __ 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/ __ 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] site review: hydrogeologist
On Tue, Jul 9, 2013 at 6:36 PM, Greg Gamble ggam...@sbctc.edu wrote: Curious on why you placed the Navigation at the bottom of the page? I believe content is king and should precede navigation in the html. Also, why are you using all of the soft hyphens ... #x00ad; ? Not all of them are necessary but primarily because font-scaling in mobile hand-sets causes long words to break the outermost containing block [producing horizontal page wiggle ]. In plain English one has to scroll both horizontally and vertically to read the text. And using -moz-hyphens:auto;-ms-hyphens:auto;-o;webkit-hyphens:auto;hyphens:auto; is not even close to being ready for prime-time. Best, David Laakso __ 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] site review: hydrogeologist
Le 10 juil. 2013 à 04:46, Karl DeSaulniers k...@designdrumm.com a écrit : Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. It is a bug in Safari 6.0x and the equivalent Mobile Safari on iOS 6.x (and maybe older versions of Safari, haven't tested). That is fixed in Safari.next. I think toggling between 'block' and 'inline-block' on the li instead of the b and a kids will work better. Keep the latter two as 'block' the whole time. 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] site review: hydrogeologist
Except chrome on iOS 6 does it too. Haven't tested chrome on the desktop, but I will. Best, Karl Sent from losPhone On Jul 9, 2013, at 9:57 PM, Philippe Wittenbergh e...@l-c-n.com wrote: Le 10 juil. 2013 à 04:46, Karl DeSaulniers k...@designdrumm.com a écrit : Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. It is a bug in Safari 6.0x and the equivalent Mobile Safari on iOS 6.x (and maybe older versions of Safari, haven't tested). That is fixed in Safari.next. I think toggling between 'block' and 'inline-block' on the li instead of the b and a kids will work better. Keep the latter two as 'block' the whole time. 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/ __ 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] site review: hydrogeologist
Le 10 juil. 2013 à 12:59, Karl DeSaulniers k...@designdrumm.com a écrit : Except chrome on iOS 6 does it too. Haven't tested chrome on the desktop, but I will. Of course. Chrome on iOS uses the exact same rendering engine as Safari. Chrome-up-to-date on desktop should have that bug fixed by the same patch as what fixed Safari nightly build. 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] site review: hydrogeologist
Chrome on my desktop doesn't cover the header, but the two green buttons get broken into two lines and the third button gets a hyphen put into it. Same with camino, just no hyphen. Same with Sunshine, just no hyphen. Same with firefox, just no hyphen, but it also covers the header. Karl DeSaulniers Design Drumm http://designdrumm.com On Jul 9, 2013, at 11:06 PM, Philippe Wittenbergh wrote: Le 10 juil. 2013 à 12:59, Karl DeSaulniers k...@designdrumm.com a écrit : Except chrome on iOS 6 does it too. Haven't tested chrome on the desktop, but I will. Of course. Chrome on iOS uses the exact same rendering engine as Safari. Chrome-up-to-date on desktop should have that bug fixed by the same patch as what fixed Safari nightly build. 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/ __ 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] site review: hydrogeologist
On Tue, Jul 9, 2013 at 10:57 PM, Philippe Wittenbergh e...@l-c-n.com wrote: Le 10 juil. 2013 à 04:46, Karl DeSaulniers k...@designdrumm.com a écrit : Take a look at it on a phone browser. I have an iPhone 5 using safari. View portrait first then rotate to landscape. The top nav (for me) is overlapping the header text. It is a bug in Safari 6.0x and the equivalent Mobile Safari on iOS 6.x (and maybe older versions of Safari, haven't tested). That is fixed in Safari.next. I think toggling between 'block' and 'inline-block' on the li instead of the b and a kids will work better. Keep the latter two as 'block' the whole time. Philippe re: http://ccstudi.com/rum/ Bingo! That's the ticket to ride. Thank you, Philippe. Best, David Laakso -- Chelsea Creek Studio http://ccstudi.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/
