vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

classic Classic list List threaded Threaded
55 messages Options
123
Reply | Threaded
Open this post in threaded view
|

vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philip Taylor (Webmaster, Ret'd)
It is only in the last few days that I have learned of the existence of vh and vw units.  I can already see just what an advance they represent, and I am very sorry that I did not learn of their existence earlier.  To which list should I subscribe if I wish to be regularly and reliably informed of changes to the CSS specification(s) ?
--
<Signature>
Philip Taylor
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Tom Livingston
I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
and a couple others I can't think of right now. If I dig them up I will
reply again.



On Thu, Mar 23, 2017 at 6:35 AM Philip Taylor <[hidden email]> wrote:

It is only in the last few days that I have learned of the existence of vh
and vw units.  I can already see just what an advance they represent, and I
am very sorry that I did not learn of their existence earlier.  To which
list should I subscribe if I wish to be regularly and reliably informed of
changes to the CSS specification(s) ?
--
<Signature>
Philip Taylor
______________________________________________________________________
css-discuss [[hidden email]]
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 | medialogic.com


#663399
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philip Taylor (Webmaster, Ret'd)


Tom Livingston wrote:
> I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
> Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
> and a couple others I can't think of right now. If I dig them up I will
> reply again.
Thank you Tom.  I suppose what I had in mind was a W3C-hosted list, but if there is no such thing then pointers to derivative lists such as these would be a good fallback.
Philip Taylor
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Tom Livingston
Sorry, that's just the typical way I hear of these types of things.
Newsletters or this list mainly.


On Thu, Mar 23, 2017 at 8:23 AM, Philip Taylor <[hidden email]> wrote:

>
>
> Tom Livingston wrote:
> > I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
> > Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
> > and a couple others I can't think of right now. If I dig them up I will
> > reply again.
> Thank you Tom.  I suppose what I had in mind was a W3C-hosted list, but if
> there is no such thing then pointers to derivative lists such as these
> would be a good fallback.
> Philip Taylor
>



--

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philippe Wittenbergh
In reply to this post by Philip Taylor (Webmaster, Ret'd)

> On Mar 23, 2017, at 7:34 PM, Philip Taylor <[hidden email]> wrote:
>
> It is only in the last few days that I have learned of the existence of vh and vw units.  I can already see just what an advance they represent, and I am very sorry that I did not learn of their existence earlier.  To which list should I subscribe if I wish to be regularly and reliably informed of changes to the CSS specification(s) ?

There is the mailing list from the CSS WG:
https://lists.w3.org/Archives/Public/www-style/

That used to be high traffic, but most of the (technical) discussions have moved to the GitHub repos. They do post when working drafts / Candidate Rec etc are posted, though. - Or if that is your kind of thing, the feed for the CSS WG: https://www.w3.org/blog/CSS/feed/atom/.

Mind you, browser makers start implementing (part of) specs (long) before things reach a stable state. `vh` and `vw` units (and their companions `vmin` and `vmax`) have been implemented for quite a few years - even IE 11 supports them.
An other resource is the list of CSS WG editor drafts: https://drafts.csswg.org.

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philip Taylor (Webmaster, Ret'd)
Thank you Philippe, thank you Tom.  https://lists.w3.org/Archives/Public/www-style/ appears to be exactly the resource that I was seeking, but the other lists are certainly of interest.
Philip Taylor
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Crest Christopher
In reply to this post by Tom Livingston
Speaking of which, can someone once again clarify, for example; 2.2em
would equal 4.4vw ?

> Tom Livingston <mailto:[hidden email]>
> Thursday, March 23, 2017 8:48 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Sorry, that's just the typical way I hear of these types of things.
> Newsletters or this list mainly.
>
>
>
>
>
> Philip Taylor <mailto:[hidden email]>
> Thursday, March 23, 2017 8:23 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Thank you Tom. I suppose what I had in mind was a W3C-hosted list, but
> if there is no such thing then pointers to derivative lists such as
> these would be a good fallback.
> Philip Taylor
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 <mailto:[hidden email]>
> Thursday, March 23, 2017 7:30 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
> Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
> and a couple others I can't think of right now. If I dig them up I will
> reply again.
>
>
>
> On Thu, Mar 23, 2017 at 6:35 AM Philip Taylor <[hidden email]> wrote:
>
> It is only in the last few days that I have learned of the existence of vh
> and vw units. I can already see just what an advance they represent, and I
> am very sorry that I did not learn of their existence earlier. To which
> list should I subscribe if I wish to be regularly and reliably informed of
> changes to the CSS specification(s) ?
> --
> <Signature>
> Philip Taylor
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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/
>
> Philip Taylor <mailto:[hidden email]>
> Thursday, March 23, 2017 6:34 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> It is only in the last few days that I have learned of the existence
> of vh and vw units. I can already see just what an advance they
> represent, and I am very sorry that I did not learn of their existence
> earlier. To which list should I subscribe if I wish to be regularly
> and reliably informed of changes to the CSS specification(s) ?

______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Mi B

> 23 mars 2017 Crest Christopher <[hidden email]>:
>
> Speaking of which, can someone once again clarify, for example; 2.2em would equal 4.4vw ?

I haven’t used these new units, but according to https://www.w3.org/TR/css3-values/#lengths 'vw’ is "1% of viewport’s width and ’vh’ is "1% of viewport’s height”. As ’ems’ are not related to the viewport ”size" at all, then I’d say you can never say what you suggest with any useful certainty, unless you somehow set the basic font size in relation to the viewport size.

Once you’ve set the basic font size for a page, you can use ems or any other relative size unit to change the size for a contained element. That’s if you’ve reset the element specific relative sizes provided by the browser itself somehow. Typically sizes are inherited, but HTML elements also have specific relative sizes in most browsers.
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Tom Livingston
In reply to this post by Crest Christopher
Once again, they are unrelated in the way you are showing here.

vw/vh units are related to the VIEWPORT dimensions. 1vm = 1% of the
viewport width, *whatever* it may be.

2.2em is a unit relative to a users browser preference setting AND/OR the
size set on a parent element. If browser preference is set at 16px then 1em
= 16px. EMs compound, so they can be tricky. So browser is set to 16px,
parent set to 2em, then child set to 2em will be equivalent to 64px (16 x 2
x 2).

REMs, on the other hand, are relative to the root element (HTML) which is
the browser preference setting. So if the browser preference is 16px and
you set an element to 1rem, NO MATTER WHERE IN THE DOM IT IS, it will be
equivalent to 16px;





On Thu, Mar 23, 2017 at 10:14 AM, Crest Christopher <
[hidden email]> wrote:

> Speaking of which, can someone once again clarify, for example; 2.2em
> would equal 4.4vw ?
>
>
>


--

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Tom Livingston
To be more clear:

REMs, on the other hand, are relative to the root element (HTML) which is
based on the browser preference setting.



On Thu, Mar 23, 2017 at 11:39 AM, Tom Livingston <[hidden email]> wrote:

> Once again, they are unrelated in the way you are showing here.
>
> vw/vh units are related to the VIEWPORT dimensions. 1vm = 1% of the
> viewport width, *whatever* it may be.
>
> 2.2em is a unit relative to a users browser preference setting AND/OR the
> size set on a parent element. If browser preference is set at 16px then 1em
> = 16px. EMs compound, so they can be tricky. So browser is set to 16px,
> parent set to 2em, then child set to 2em will be equivalent to 64px (16 x 2
> x 2).
>
> REMs, on the other hand, are relative to the root element (HTML) which is
> the browser preference setting. So if the browser preference is 16px and
> you set an element to 1rem, NO MATTER WHERE IN THE DOM IT IS, it will be
> equivalent to 16px;
>
>
>
>
>
> On Thu, Mar 23, 2017 at 10:14 AM, Crest Christopher <
> [hidden email]> wrote:
>
>> Speaking of which, can someone once again clarify, for example; 2.2em
>> would equal 4.4vw ?
>>
>>
>>
>
>
> --
>
> Tom Livingston | Senior Front End Developer | Media Logic |
> ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
>
>
> #663399
>



--

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

olegk65@gmail.com
In reply to this post by Crest Christopher
Funny...

No, they would not be equal in 99.99% of the cases :)

On Thu, Mar 23, 2017 at 7:14 AM, Crest Christopher <
[hidden email]> wrote:

> Speaking of which, can someone once again clarify, for example; 2.2em
> would equal 4.4vw ?
>
> Tom Livingston <mailto:[hidden email]>
>> Thursday, March 23, 2017 8:48 AMvia Postbox <
>> https://www.postbox-inc.com/?utm_source=email&utm_medium=su
>> mlink&utm_campaign=reach>
>> Sorry, that's just the typical way I hear of these types of things.
>> Newsletters or this list mainly.
>>
>>
>>
>>
>>
>> Philip Taylor <mailto:[hidden email]>
>> Thursday, March 23, 2017 8:23 AMvia Postbox <
>> https://www.postbox-inc.com/?utm_source=email&utm_medium=su
>> mlink&utm_campaign=reach>
>> Thank you Tom. I suppose what I had in mind was a W3C-hosted list, but if
>> there is no such thing then pointers to derivative lists such as these
>> would be a good fallback.
>> Philip Taylor
>> ______________________________________________________________________
>> css-discuss [[hidden email]]
>> 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 <mailto:[hidden email]>
>> Thursday, March 23, 2017 7:30 AMvia Postbox <
>> https://www.postbox-inc.com/?utm_source=email&utm_medium=su
>> mlink&utm_campaign=reach>
>> I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
>> Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
>> and a couple others I can't think of right now. If I dig them up I will
>> reply again.
>>
>>
>>
>> On Thu, Mar 23, 2017 at 6:35 AM Philip Taylor <[hidden email]>
>> wrote:
>>
>> It is only in the last few days that I have learned of the existence of vh
>> and vw units. I can already see just what an advance they represent, and I
>> am very sorry that I did not learn of their existence earlier. To which
>> list should I subscribe if I wish to be regularly and reliably informed of
>> changes to the CSS specification(s) ?
>> --
>> <Signature>
>> Philip Taylor
>> ______________________________________________________________________
>> css-discuss [[hidden email]]
>> 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/
>>
>> Philip Taylor <mailto:[hidden email]>
>> Thursday, March 23, 2017 6:34 AMvia Postbox <
>> https://www.postbox-inc.com/?utm_source=email&utm_medium=su
>> mlink&utm_campaign=reach>
>> It is only in the last few days that I have learned of the existence of
>> vh and vw units. I can already see just what an advance they represent, and
>> I am very sorry that I did not learn of their existence earlier. To which
>> list should I subscribe if I wish to be regularly and reliably informed of
>> changes to the CSS specification(s) ?
>>
>
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Crest Christopher
In reply to this post by Tom Livingston
What do you mean EM are compound ?

If the browser is set to 16px and the parent is 2.1em and the child is
set to 1.4em that would be 47.xx vw ?

> Tom Livingston <mailto:[hidden email]>
> Thursday, March 23, 2017 11:39 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Once again, they are unrelated in the way you are showing here.
>
> vw/vh units are related to the VIEWPORT dimensions. 1vm = 1% of the
> viewport width, *whatever* it may be.
>
> 2.2em is a unit relative to a users browser preference setting AND/OR
> the size set on a parent element. If browser preference is set at 16px
> then 1em = 16px. EMs compound, so they can be tricky. So browser is
> set to 16px, parent set to 2em, then child set to 2em will be
> equivalent to 64px (16 x 2 x 2).
>
> REMs, on the other hand, are relative to the root element (HTML) which
> is the browser preference setting. So if the browser preference is
> 16px and you set an element to 1rem, NO MATTER WHERE IN THE DOM IT IS,
> it will be equivalent to 16px;
>
>
>
>
>
>
>
>
> --
>
> Tom Livingston | Senior Front End Developer | Media Logic |
> ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
> <http://medialogic.com>
>
>
> #663399
> Crest Christopher <mailto:[hidden email]>
> Thursday, March 23, 2017 10:14 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Speaking of which, can someone once again clarify, for example; 2.2em
> would equal 4.4vw ?
>
>
> Tom Livingston <mailto:[hidden email]>
> Thursday, March 23, 2017 8:48 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Sorry, that's just the typical way I hear of these types of things.
> Newsletters or this list mainly.
>
>
>
>
>
> Philip Taylor <mailto:[hidden email]>
> Thursday, March 23, 2017 8:23 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Thank you Tom. I suppose what I had in mind was a W3C-hosted list, but
> if there is no such thing then pointers to derivative lists such as
> these would be a good fallback.
> Philip Taylor
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 <mailto:[hidden email]>
> Thursday, March 23, 2017 7:30 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
> Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
> and a couple others I can't think of right now. If I dig them up I will
> reply again.
>
>
>
> On Thu, Mar 23, 2017 at 6:35 AM Philip Taylor <[hidden email]> wrote:
>
> It is only in the last few days that I have learned of the existence of vh
> and vw units. I can already see just what an advance they represent, and I
> am very sorry that I did not learn of their existence earlier. To which
> list should I subscribe if I wish to be regularly and reliably informed of
> changes to the CSS specification(s) ?
> --
> <Signature>
> Philip Taylor
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Crest Christopher
In reply to this post by Mi B
When using vw/vh em are always going to be doubled ? What about pixels ?

For example; 2em is equal to 4vw. Also

If the default font size is 16 pixels and if |2vw| is 2% of the
viewport’s width ?

> Mi B <mailto:[hidden email]>
> Thursday, March 23, 2017 11:16 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
>
> I haven’t used these new units, but according to
> https://www.w3.org/TR/css3-values/#lengths 'vw’ is "1% of viewport’s
> width and ’vh’ is "1% of viewport’s height”. As ’ems’ are not related
> to the viewport ”size" at all, then I’d say you can never say what you
> suggest with any useful certainty, unless you somehow set the basic
> font size in relation to the viewport size.
>
> Once you’ve set the basic font size for a page, you can use ems or any
> other relative size unit to change the size for a contained element.
> That’s if you’ve reset the element specific relative sizes provided by
> the browser itself somehow. Typically sizes are inherited, but HTML
> elements also have specific relative sizes in most browsers.
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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:[hidden email]>
> Thursday, March 23, 2017 10:14 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Speaking of which, can someone once again clarify, for example; 2.2em
> would equal 4.4vw ?
>
>
> Tom Livingston <mailto:[hidden email]>
> Thursday, March 23, 2017 8:48 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Sorry, that's just the typical way I hear of these types of things.
> Newsletters or this list mainly.
>
>
>
>
>
> Philip Taylor <mailto:[hidden email]>
> Thursday, March 23, 2017 8:23 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Thank you Tom. I suppose what I had in mind was a W3C-hosted list, but
> if there is no such thing then pointers to derivative lists such as
> these would be a good fallback.
> Philip Taylor
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 <mailto:[hidden email]>
> Thursday, March 23, 2017 7:30 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> I subscribe to newsletters such as Frontend Focus, Alistapart (digest),
> Versioning (less focused, but good), Responsive Design Weekly, CSS-tricks
> and a couple others I can't think of right now. If I dig them up I will
> reply again.
>
>
>
> On Thu, Mar 23, 2017 at 6:35 AM Philip Taylor <[hidden email]> wrote:
>
> It is only in the last few days that I have learned of the existence of vh
> and vw units. I can already see just what an advance they represent, and I
> am very sorry that I did not learn of their existence earlier. To which
> list should I subscribe if I wish to be regularly and reliably informed of
> changes to the CSS specification(s) ?
> --
> <Signature>
> Philip Taylor
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Felix Miata-2
In reply to this post by Crest Christopher
Crest Christopher composed on 2017-03-23 21:55 (UTC-0400):

> What do you mean EM are compound ?

> If the browser is set to 16px and the parent is 2.1em and the child is
> set to 1.4em that would be 47.xx vw ?

It would be 47.04px, regardless of the viewport width or height.
--
"The wise are known for their understanding, and pleasant
words are persuasive." Proverbs 16:21 (New Living Translation)

  Team OS/2 ** Reg. Linux User #211409 ** a11y rocks!

Felix Miata  ***  http://fm.no-ip.com/
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Tom Livingston
In reply to this post by Crest Christopher
Seems to me you are needlessly - and confusingly - mixing sizing methods.

I'm tapping out on this thread.

Goodnight all.


On Thu, Mar 23, 2017 at 10:02 PM, Crest Christopher <
[hidden email]> wrote:

> When using vw/vh em are always going to be doubled ? What about pixels ?
>
> For example; 2em is equal to 4vw. Also
>
> If the default font size is 16 pixels and if |2vw| is 2% of the viewport’s
> width ?
>


--

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philippe Wittenbergh
In reply to this post by Crest Christopher

> On Mar 24, 2017, at 11:02 AM, Crest Christopher <[hidden email]> wrote:
>
> When using vw/vh em are always going to be doubled ? What about pixels ?
>
> For example; 2em is equal to 4vw. Also
>
> If the default font size is 16 pixels and if |2vw| is 2% of the viewport’s width ?

Mr Crest,

As others have already said: `em` units and `vw` units have NOTHING, I repeat, NOTHING, to do with each other.

(also, if you don’t mind, please take the time to trim your replies to this list)


Philippe
--
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Crest Christopher
As mentioned EM and VW have nothing to do with each other. Therefore the
following

Correct me if I'm wrong but wouldn't the following be 4.4em if 2.2vw is
added to the font-size of 2.2em ?

calc( 2.2em + 2.2vw );.




> Philippe Wittenbergh <mailto:[hidden email]>
> Thursday, March 23, 2017 10:24 PMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
>
> Mr Crest,
>
> As others have already said: `em` units and `vw` units have NOTHING, I
> repeat, NOTHING, to do with each other.
>
> (also, if you don’t mind, please take the time to trim your replies to
> this list)
>
>
> Philippe
> --
> Philippe Wittenbergh
> http://l-c-n.com/
>
>
>
>
>
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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:[hidden email]>
> Thursday, March 23, 2017 10:02 PMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> When using vw/vh em are always going to be doubled ? What about pixels ?
>
> For example; 2em is equal to 4vw. Also
>
> If the default font size is 16 pixels and if |2vw| is 2% of the
> viewport’s width ?
>
>
> Mi B <mailto:[hidden email]>
> Thursday, March 23, 2017 11:16 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
>
> I haven’t used these new units, but according to
> https://www.w3.org/TR/css3-values/#lengths 'vw’ is "1% of viewport’s
> width and ’vh’ is "1% of viewport’s height”. As ’ems’ are not related
> to the viewport ”size" at all, then I’d say you can never say what you
> suggest with any useful certainty, unless you somehow set the basic
> font size in relation to the viewport size.
>
> Once you’ve set the basic font size for a page, you can use ems or any
> other relative size unit to change the size for a contained element.
> That’s if you’ve reset the element specific relative sizes provided by
> the browser itself somehow. Typically sizes are inherited, but HTML
> elements also have specific relative sizes in most browsers.
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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:[hidden email]>
> Thursday, March 23, 2017 10:14 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Speaking of which, can someone once again clarify, for example; 2.2em
> would equal 4.4vw ?
>
>
> Tom Livingston <mailto:[hidden email]>
> Thursday, March 23, 2017 8:48 AMvia Postbox
> <https://www.postbox-inc.com/?utm_source=email&utm_medium=sumlink&utm_campaign=reach>
> Sorry, that's just the typical way I hear of these types of things.
> Newsletters or this list mainly.
>
>
>
>
>

______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philippe Wittenbergh

> On Mar 29, 2017, at 8:06 AM, Crest Christopher <[hidden email]> wrote:
>
> Correct me if I'm wrong but wouldn't the following be 4.4em if 2.2vw is added to the font-size of 2.2em ?
>
> calc( 2.2em + 2.2vw );.

NO. The `vw` unit is short for `viewport-WIDTH` [1]. Per spec text: “vw unit: Equal to 1% of the width of the initial containing block.”

Or perhaps I should qualify my answer:

It _is_ possible that the **computed** value of 4.4em equals the computed value of `calc(2.2em + 2.2vw)`, if
* the initial containing block (window) is a certain width,
* the cascade doesn’t mess up with your calculations,
* the stars align
* the stock market crashed
* ….
* ……
* my cat sleeps more than 10cm away from my keyboard

In other words, almost certainly never.


[1] https://drafts.csswg.org/css-values-3/#viewport-relative-lengths

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Philippe Wittenbergh
In reply to this post by Crest Christopher

> On Mar 29, 2017, at 8:06 AM, Crest Christopher <[hidden email]> wrote:
>
> Correct me if I'm wrong but wouldn't the following be 4.4em if 2.2vw is added to the font-size of 2.2em ?
>
> calc( 2.2em + 2.2vw );.

NO. The `vw` unit is short for `viewport-WIDTH` [1]. Per spec text: “vw unit: Equal to 1% of the width of the initial containing block.”

Or perhaps I should qualify my answer:

It _is_ possible that the **computed** value of 4.4em equals the computed value of `calc(2.2em + 2.2vw)`, if
* the initial containing block (window) is a certain width,
* the cascade doesn’t mess up with your calculations,
* the stars align
* the stock market crashed
* ….
* ……
* my cat sleeps more than 10cm away from my keyboard

In other words, almost certainly never.


[1] https://drafts.csswg.org/css-values-3/#viewport-relative-lengths

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/





______________________________________________________________________
css-discuss [[hidden email]]
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/
Reply | Threaded
Open this post in threaded view
|

Re: vw and vh units -- how does one learn of developments in the CSS spec. such as these ?

Karl DeSaulniers
In reply to this post by Philippe Wittenbergh
Ouch. My stomach hurts.

@crest
Go post that question on Stack Overflow and see what they say.

Best,
Karl

Sent from losPhone

> On Mar 23, 2017, at 9:24 PM, Philippe Wittenbergh <[hidden email]> wrote:
>
>
>> On Mar 24, 2017, at 11:02 AM, Crest Christopher <[hidden email]> wrote:
>>
>> When using vw/vh em are always going to be doubled ? What about pixels ?
>>
>> For example; 2em is equal to 4vw. Also
>>
>> If the default font size is 16 pixels and if |2vw| is 2% of the viewport’s width ?
>
> Mr Crest,
>
> As others have already said: `em` units and `vw` units have NOTHING, I repeat, NOTHING, to do with each other.
>
> (also, if you don’t mind, please take the time to trim your replies to this list)
>
>
> Philippe
> --
> Philippe Wittenbergh
> http://l-c-n.com/
>
>
>
>
>
> ______________________________________________________________________
> css-discuss [[hidden email]]
> 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 [[hidden email]]
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/
123