Re: [css-d] iPad differences
Chrome is built off of Gecko and Webkit anyway. Probably why you didn't see much difference. It "technically" IS Safari under the hood. As far as emulators go.. Makes sense to me to use Apple's web browser for testing for Apple devices. Makes sense to me to use Chrome for testing for Android devices, since Google created Android. Makes sense to me to use IE for testing Windows Phone, since duh it's Windows Phone. Makes sense to me to use FireFox for.. well.. FireFox and that is about it. lol I have found that using the emulator created by the brand of device it is associated with will get you "closer" results to the actual device then using another browsers attempt at implementing emulation for a product they don't make. I don't know, maybe it's just me. Best, Karl DeSaulniers Design Drumm http://designdrumm.com > On Aug 11, 2016, at 12:18 AM, Crest Christopher> wrote: > > The last time I downloaded Safari for Windows, I didn't notice a > difference with the emulated with Retina Devices in Chrome so I removed > Safari. > > Karl DeSaulniers wrote: >> >> I have an iPhone still on iOS 7. >> No iPad though. >> >> @crest - you do know you can view inspect element of any iPhone or >> iPad in safari desktop? safari also has a responsive design mode. >> Works best for iPhone and iPad emulation I have found. >> >> Best, >> Karl >> >> Sent from losPhone >> >>> >>> On Aug 10, 2016, at 6:44 PM, Crest Christopher >>> wrote: >>> >>> Philippe you have an actual iPad ? >>> >>> Philippe Wittenbergh wrote: > > On Aug 11, 2016, at 8:24 AM, Crest Christopher > wrote: > > Although > the simulator uses iOS 7.1.2 and since I know nothing of iOS, strictly > Windows but from what may be possible is newer versions of iOS may have > issues such as this fixed ? Latest iOS version is 9.3.x. Hard to say if your issue is real, a bug in an older version of iOS or something else. As always a link to the issue at hand would immensely facilitated the discussion. 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/ > __ > 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] iPad differences
The last time I downloaded Safari for Windows, I didn't notice a difference with the emulated with Retina Devices in Chrome so I removed Safari. Karl DeSaulniers wrote: > > I have an iPhone still on iOS 7. > No iPad though. > > @crest - you do know you can view inspect element of any iPhone or > iPad in safari desktop? safari also has a responsive design mode. > Works best for iPhone and iPad emulation I have found. > > Best, > Karl > > Sent from losPhone > >> >> On Aug 10, 2016, at 6:44 PM, Crest Christopher >>wrote: >> >> Philippe you have an actual iPad ? >> >> Philippe Wittenbergh wrote: >>> On Aug 11, 2016, at 8:24 AM, Crest Christopher wrote: Although the simulator uses iOS 7.1.2 and since I know nothing of iOS, strictly Windows but from what may be possible is newer versions of iOS may have issues such as this fixed ? >>> >>> >>> Latest iOS version is 9.3.x. Hard to say if your issue is real, a bug >>> in an older version of iOS or something else. >>> As always a link to the issue at hand would immensely facilitated the >>> discussion. >>> >>> 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/ __ 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] iPad differences
I have an iPhone still on iOS 7. No iPad though. @crest - you do know you can view inspect element of any iPhone or iPad in safari desktop? safari also has a responsive design mode. Works best for iPhone and iPad emulation I have found. Best, Karl Sent from losPhone > On Aug 10, 2016, at 6:44 PM, Crest Christopher> wrote: > > Philippe you have an actual iPad ? > > Philippe Wittenbergh wrote: >> >>> >>> On Aug 11, 2016, at 8:24 AM, Crest Christopher >>> wrote: >>> >>> Although >>> the simulator uses iOS 7.1.2 and since I know nothing of iOS, strictly >>> Windows but from what may be possible is newer versions of iOS may have >>> issues such as this fixed ? >> >> >> Latest iOS version is 9.3.x. Hard to say if your issue is real, a bug >> in an older version of iOS or something else. >> As always a link to the issue at hand would immensely facilitated the >> discussion. >> >> 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] iPad differences
Yes. Very aware. That was the top google search results I found using crests key words. Being that he has been asking about retina images in the past, I felt it was worth noting the pixel dimensions. Best, Karl Sent from losPhone > On Aug 10, 2016, at 6:34 PM, Philippe Wittenberghwrote: > > >> On Aug 11, 2016, at 3:23 AM, Karl DeSaulniers wrote: >> >> They are not the same resolution or size. >> >> The biggest difference between these tablets is screen density. >> The iPad mini's display is 7.9 inches diagonally, with 1024 x 768 resolution >> at 163 pixels per inch. >> The iPad with Retina display packs a punch — 9.7 inches, with 2048 x 1536 >> resolution at 264 pixels per inch. > > But those have absolutely no effect on CSS. Both devices have exactly the > same size as CSS is concerned 1024 by 768 CSS pixels (which as you know are > not the same as screen pixels). > > 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/
[css-d] Element Size with border
I tent to work with alot of assets and hopefully someone can help me. I know the Web Development toolkits that come with all web browsers can show the element width & height. Is it possible to add a border to the element in pixels and include that when analyzing the elements size and position ? It would be extremely helpful when getting graphics at a perfect size without guess work. Also what is speccing ? __ 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] iPad differences
Philippe you have an actual iPad ? Philippe Wittenbergh wrote: > >> >> On Aug 11, 2016, at 8:24 AM, Crest Christopher >>wrote: >> >> Although >> the simulator uses iOS 7.1.2 and since I know nothing of iOS, strictly >> Windows but from what may be possible is newer versions of iOS may have >> issues such as this fixed ? > > > Latest iOS version is 9.3.x. Hard to say if your issue is real, a bug > in an older version of iOS or something else. > As always a link to the issue at hand would immensely facilitated the > discussion. > > 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] iPad differences
> On Aug 11, 2016, at 3:23 AM, Karl DeSaulnierswrote: > > They are not the same resolution or size. > > The biggest difference between these tablets is screen density. > The iPad mini's display is 7.9 inches diagonally, with 1024 x 768 resolution > at 163 pixels per inch. > The iPad with Retina display packs a punch — 9.7 inches, with 2048 x 1536 > resolution at 264 pixels per inch. But those have absolutely no effect on CSS. Both devices have exactly the same size as CSS is concerned 1024 by 768 CSS pixels (which as you know are not the same as screen pixels). 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] iPad differences
> On Aug 11, 2016, at 8:24 AM, Crest Christopher> wrote: > > Although > the simulator uses iOS 7.1.2 and since I know nothing of iOS, strictly > Windows but from what may be possible is newer versions of iOS may have > issues such as this fixed ? Latest iOS version is 9.3.x. Hard to say if your issue is real, a bug in an older version of iOS or something else. As always a link to the issue at hand would immensely facilitated the discussion. 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] iPad differences
Unfortunately I have to rely on a emulator \ simulator that will mean that I may once the page is online encounter issues that will have to be fixed when those issues arise on whatever device that may be. In the mean-time, the iPad I'm testing on has a 1024x768 resolution. Chrome device emulation shows the element in the position I desire, while on the simulator the element is in the wrong position. Although the simulator uses iOS 7.1.2 and since I know nothing of iOS, strictly Windows but from what may be possible is newer versions of iOS may have issues such as this fixed ? Philippe Wittenbergh wrote: > >> >> On Aug 10, 2016, at 11:37 PM, Crest Christopher >>wrote: >> >> TheiPad & iPad mini are both the same CSS width but when previewing both >> devices; the iPad Mini give me problems with one element. Shouldn't the >> results be identical ? > > > Are you testing with real world, physical devices? Or with some > emulator / simulator kind of thing? The latter gives you at best an > approximation of the real thing (assuming you use an emulation that > uses the WebKit rendering engine). > > 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] Flexbox struggle
> On Aug 11, 2016, at 5:57 AM, Tom Livingstonwrote: > > a p:last-child{align-self: flex-end;} to get the last to stick to > the bottom of s, but this isn't working. Where am I messing it up? Perhaps: a p:last-child { margin-top: auto; } 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] iPad differences
> On Aug 10, 2016, at 11:37 PM, Crest Christopher> wrote: > > TheiPad & iPad mini are both the same CSS width but when previewing both > devices; the iPad Mini give me problems with one element. Shouldn't the > results be identical ? Are you testing with real world, physical devices? Or with some emulator / simulator kind of thing? The latter gives you at best an approximation of the real thing (assuming you use an emulation that uses the WebKit rendering engine). 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] iPad differences
You are referring to the iPad 3,4 & Air. I meant the iPad 1,2. The iPad Pro is the largest at 2048 width. I guess I'm going to target these Apple devices with criteria other then device-width. Karl DeSaulniers wrote: > > They are not the same resolution or size. > > The biggest difference between these tablets is screen density. > The iPad mini's display is 7.9 inches diagonally, with 1024 x 768 > resolution at 163 pixels per inch. > The iPad with Retina display packs a punch — 9.7 inches, with 2048 x > 1536 resolution at 264 pixels per inch. > > HTH, > > Best, > > Karl DeSaulniers > Design Drumm > http://designdrumm.com > > > > >> >> On Aug 10, 2016, at 9:37 AM, Crest Christopher >>wrote: >> >> TheiPad & iPad mini are both the same CSS width but when previewing both >> devices; the iPad Mini give me problems with one element. Shouldn't the >> results be identical ? >> __ >> 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-d] Flexbox struggle
Listers, Can't post a link yet, but maybe you can still help me as I still don't have a firm grip on flex yet... Given: div{ display:flex; flex-direction: row;} sets my s to be the same height as based on tallest. Perfect. a{ display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start;} sets my s as flex containers also. a p:last-child{align-self: flex-end;} to get the last to stick to the bottom of s, but this isn't working. Where am I messing it up? Thanks -- Tom Livingston | Senior Front End Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com #663399 __ 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] iPad differences
They are not the same resolution or size. The biggest difference between these tablets is screen density. The iPad mini's display is 7.9 inches diagonally, with 1024 x 768 resolution at 163 pixels per inch. The iPad with Retina display packs a punch — 9.7 inches, with 2048 x 1536 resolution at 264 pixels per inch. HTH, Best, Karl DeSaulniers Design Drumm http://designdrumm.com > On Aug 10, 2016, at 9:37 AM, Crest Christopher> wrote: > > TheiPad & iPad mini are both the same CSS width but when previewing both > devices; the iPad Mini give me problems with one element. Shouldn't the > results be identical ? > __ > 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] iPad differences
TheiPad & iPad mini are both the same CSS width but when previewing both devices; the iPad Mini give me problems with one element. Shouldn't the results be identical ? __ 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/