> apr. 1 2017 kl. 00:32 Crest Christopher <crestchristop...@gmail.com>: > > How do you get 96px from 8vw if the viewport width is 1200px ?
width 1200 px 1 vw =0,01*width px target 96 px exp as (target/1vw )vw>> 8vw > >> Tom Livingston <mailto:tom...@gmail.com> >> Friday, March 31, 2017 12:24 PMvia Postbox >> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach> >> >> https://www.sitepoint.com/css-viewport-units-quick-start/ >> >> >> >> Karl DeSaulniers <mailto:k...@designdrumm.com> >> Wednesday, March 29, 2017 8:18 PMvia Postbox >> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach> >> @crest, >> Instead, why don't you explain what you're trying to accomplish (in as few >> words as possible) >> and we can let you know if VW and VH is practical or if you should be using >> a different way to accomplish said task. >> >> My thoughts are that you are trying to make your text size as the window >> gets resized. Am I correct in this assumption? >> >> Best, >> >> Karl DeSaulniers >> Design Drumm >> http://designdrumm.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/ >> Crest Christopher <mailto:crestchristop...@gmail.com> >> Wednesday, March 29, 2017 8:20 AMvia Postbox >> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach> >> >> That is 1000 / 100, how did you get 2.2 from 1000/100 that is 10 ? >> >> Philippe Wittenbergh <mailto:e...@l-c-n.com> >> Wednesday, March 29, 2017 1:25 AMvia Postbox >> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach> >> >> Ok, I assume, given that paragraph above (a quote from somewhere on the >> internets?, source?), I assume you are trying to understand what the >> following means: >> >> .myclass { font-size: calc( 2.2em + 2.2vw); } >> >> 1. calc() means: calculate the sum of the following two values. >> 2. 2.2em - converted a pixel size, assuming 16px base font: 16 * 2.2 = >> 35.2px. >> 3. 2.2vw - here is where it gets interesting: `vw` stands for viewport >> width, 1vw = 1% of the viewport width. >> Let’s assume a 1000px wide viewport / window, then 2.2vw * 1000px/100 = 2.2 >> * 10 = 22px >> >> Thus: calc( 2.2em + 2.2vw) = 35.2px + 22px = 57.2px >> >> 3b. Now resize the window, let’s assume the viewport / window is 500px wide; >> 2.2 * 500/100 = 2.2 * 5 = 11px. In this case, the font-size will be 35.2px + >> 11px = 46.2px. >> >> Philippe >> -- >> Philippe Wittenbergh >> http://l-c-n.com/ >> >> >> >> >> >> Crest Christopher <mailto:crestchristop...@gmail.com> >> Tuesday, March 28, 2017 11:24 PMvia Postbox >> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach> >> Your stomach is hurting from the antacids. >> I'm only trying to understand. >> >> >> Take my previous example and help me understand. >> >> >> >> >> >> > > ______________________________________________________________________ > 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/
