
GITHUB . COM {
}
Detected CMS Systems:
- Wordpress (2 occurrences)
Title:
[css-values-4] Add vhc value Β· Issue #4329 Β· w3c/csswg-drafts
Description:
Latest info Added lvh, svh, dvh, lvw, svw, and dvw units. See #4329 (comment) and #4329 (comment) for more details. π Original content below: Background vh is defined as Equal to 1% of the height of the initial containing block. Perhaps ...
Website Age:
17 years and 8 months (reg. 2007-10-09).
Matching Content Categories {π}
- Video & Online Content
- Social Networks
- Technology & Computing
Content Management System {π}
What CMS is github.com built with?
Github.com is powered by WORDPRESS.
Traffic Estimate {π}
What is the average monthly size of github.com audience?
ππ Tremendous Traffic: 10M - 20M visitors per month
Based on our best estimate, this website will receive around 10,000,019 visitors per month in the current month.
However, some sources were not loaded, we suggest to reload the page to get complete results.
check SE Ranking
check Ahrefs
check Similarweb
check Ubersuggest
check Semrush
How Does Github.com Make Money? {πΈ}
Subscription Packages {π³}
We've located a dedicated page on github.com that might include details about subscription plans or recurring payments. We identified it based on the word pricing in one of its internal links. Below, you'll find additional estimates for its monthly recurring revenues.How Much Does Github.com Make? {π°}
Subscription Packages {π³}
Prices on github.com are in US Dollars ($).
They range from $4.00/month to $21.00/month.
We estimate that the site has approximately 4,989,889 paying customers.
The estimated monthly recurring revenue (MRR) is $20,957,532.
The estimated annual recurring revenues (ARR) are $251,490,385.
Wordpress Themes and Plugins {π¨}
What WordPress theme does this site use?
It is strange but we were not able to detect any theme on the page.
What WordPress plugins does this website use?
It is strange but we were not able to detect any plugins on the page.
Keywords {π}
chrome, content, units, frehner, size, commented, vhc, react, cssvalues, issue, add, current, viewport, proposal, behavior, user, browser, scroll, tabatkins, original, defined, initial, block, devices, variables, type, sign, comment, height, unit, doesnt, author, rachelandrew, default, shift, projects, closed, added, equal, minimized, cut, load, page, experience, end, alternative, fantasai, contributor, case, scrollbars,
Topics {βοΈ}
ua chrome hiding/showing screen-keyboard showing/hiding io/javascript/2019/09/28/avoid-100vh frehner edits author whitespace added large text box expose environment variables safe inset area rwd browser tools full-screen content issues opened things possibly shift content-based decision browser chrome appearing vh units altogether full-height website type projects move/change size appearing chrome problem url bar projects milestone additional content visible vhc units vhc unit current behavior current workarounds current situation proposal vhc values personal preference frehner changed changing chrome size closed ua chrome add additional content browser chrome scrolling window behaved originally vh units completely solve horrible ux browser widgets 1vh based content fits caused content background vh vh unit stops vh original behavior
Payment Methods {π}
- Braintree
Questions {β}
- (If not, sorry, can you explain what you mean?
- Ah, hm, is this the issue?
- Already have an account?
- Further question: should it respond to on-screen-keyboard showing/hiding?
- I think that would put us back at the original behavior of vh units, which means that content actually changes size (and thus can shift underneath the user) when you scroll, right?
- In what situations would it be worse?
- Is this behavior ever useful?
- Or is there something special about this URL bar?
- Should it respond to on-screen-keyboard showing/hiding?
- Sorry, can you clarify what you mean by this?
Schema {πΊοΈ}
DiscussionForumPosting:
context:https://schema.org
headline:[css-values-4] Add vhc value
articleBody:## Latest info
Added `lvh`, `svh`, `dvh`, `lvw`, `svw`, and `dvw` units.
See https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-863677668 and https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-880040513 for more details. π
Original content below:
## Background
`vh` is [defined](https://drafts.csswg.org/css-values-4/#viewport-relative-lengths) as `Equal to 1% of the height of the initial containing block.` Perhaps the current **behaviour**<sup> [1](https://bugs.webkit.org/show_bug.cgi?id=141832) [2](https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/BK0oHURgmJ4)</sup> could also be defined as
>Equal to 1% of the height of the initial containing block _with user agent chrome minimized_.
In other words, on devices where the browser chrome changes size (e.g. mobile devices), `100vh` is actually larger than the viewport when the browser chrome is maximized, and thus overflows.
A brief history of the `vh` unit is outlined here https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-542420036
## Proposal
`vhc` (c = "with chrome", but it could be something else) could be defined as
>Equal to 1% of the height of the initial containing block, with user agent chrome maximized
On devices without a changing chrome size (e.g. desktop devices), `1vh === 1vhc`.
## Advantages and Drawbacks
[Pros and Cons list for each proposal](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-547551485)
Original content of this section:
A drawback of `vh` units is that content will be cut off when (1) you load a page and (2) when you scroll upwards, while the content fits when you scroll down and the chrome is minimized.
The `vhc` unit would be the inverse: content would fit the page when (1) you load the page and (2) when you scroll upwards, but you would see additional content (or whitespace, depending on the implementation) when the chrome is minimized.
It also would provide a better experience than `vh` for games and other full-screen content that doesn't or shouldn't scroll at all.
In the end, this proposal does not completely solve the issue of `1vh` needing to be different values at different times. However, it _does_ at least give the developer a choice in which value that they want to use.
(For what it's worth, my personal preference is that I would end up using `vhc` units for responsive designs, because I would rather have additional content visible or some whitespace added, rather than have content cut off and not visible.)
## Alternative Proposals
* [css env variables](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-542971506)
* [vh-sizing](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-543344105)
And [a breakdown](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-547551485) of the pros and cons of each proposal so far
## Current Workarounds
As it stands, web developers that want to have a full-height website are either reliant on javascript <sup> [1](https://css-tricks.com/the-trick-to-viewport-units-on-mobile/) [2](https://stackoverflow.com/a/43575432) [3](https://github.com/mvasin/react-div-100vh)</sup> to get `vh` units to not cut off content, or just tend to avoid <sup>[1](https://chanind.github.io/javascript/2019/09/28/avoid-100vh-on-mobile-web.html)</sup> using `vh` units altogether.
## Unrelated
This is my first time proposing, so if I did something wrong or need to improve something please let me know! Thank you for your patience. :)
author:
url:https://github.com/frehner
type:Person
name:frehner
datePublished:2019-09-18T18:00:03.000Z
interactionStatistic:
type:InteractionCounter
interactionType:https://schema.org/CommentAction
userInteractionCount:102
url:https://github.com/4329/csswg-drafts/issues/4329
context:https://schema.org
headline:[css-values-4] Add vhc value
articleBody:## Latest info
Added `lvh`, `svh`, `dvh`, `lvw`, `svw`, and `dvw` units.
See https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-863677668 and https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-880040513 for more details. π
Original content below:
## Background
`vh` is [defined](https://drafts.csswg.org/css-values-4/#viewport-relative-lengths) as `Equal to 1% of the height of the initial containing block.` Perhaps the current **behaviour**<sup> [1](https://bugs.webkit.org/show_bug.cgi?id=141832) [2](https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/BK0oHURgmJ4)</sup> could also be defined as
>Equal to 1% of the height of the initial containing block _with user agent chrome minimized_.
In other words, on devices where the browser chrome changes size (e.g. mobile devices), `100vh` is actually larger than the viewport when the browser chrome is maximized, and thus overflows.
A brief history of the `vh` unit is outlined here https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-542420036
## Proposal
`vhc` (c = "with chrome", but it could be something else) could be defined as
>Equal to 1% of the height of the initial containing block, with user agent chrome maximized
On devices without a changing chrome size (e.g. desktop devices), `1vh === 1vhc`.
## Advantages and Drawbacks
[Pros and Cons list for each proposal](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-547551485)
Original content of this section:
A drawback of `vh` units is that content will be cut off when (1) you load a page and (2) when you scroll upwards, while the content fits when you scroll down and the chrome is minimized.
The `vhc` unit would be the inverse: content would fit the page when (1) you load the page and (2) when you scroll upwards, but you would see additional content (or whitespace, depending on the implementation) when the chrome is minimized.
It also would provide a better experience than `vh` for games and other full-screen content that doesn't or shouldn't scroll at all.
In the end, this proposal does not completely solve the issue of `1vh` needing to be different values at different times. However, it _does_ at least give the developer a choice in which value that they want to use.
(For what it's worth, my personal preference is that I would end up using `vhc` units for responsive designs, because I would rather have additional content visible or some whitespace added, rather than have content cut off and not visible.)
## Alternative Proposals
* [css env variables](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-542971506)
* [vh-sizing](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-543344105)
And [a breakdown](https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-547551485) of the pros and cons of each proposal so far
## Current Workarounds
As it stands, web developers that want to have a full-height website are either reliant on javascript <sup> [1](https://css-tricks.com/the-trick-to-viewport-units-on-mobile/) [2](https://stackoverflow.com/a/43575432) [3](https://github.com/mvasin/react-div-100vh)</sup> to get `vh` units to not cut off content, or just tend to avoid <sup>[1](https://chanind.github.io/javascript/2019/09/28/avoid-100vh-on-mobile-web.html)</sup> using `vh` units altogether.
## Unrelated
This is my first time proposing, so if I did something wrong or need to improve something please let me know! Thank you for your patience. :)
author:
url:https://github.com/frehner
type:Person
name:frehner
datePublished:2019-09-18T18:00:03.000Z
interactionStatistic:
type:InteractionCounter
interactionType:https://schema.org/CommentAction
userInteractionCount:102
url:https://github.com/4329/csswg-drafts/issues/4329
Person:
url:https://github.com/frehner
name:frehner
url:https://github.com/frehner
name:frehner
InteractionCounter:
interactionType:https://schema.org/CommentAction
userInteractionCount:102
interactionType:https://schema.org/CommentAction
userInteractionCount:102
External Links {π}(9)
- What's the financial gain of https://github.blog?
- What is the earnings of https://drafts.csswg.org/css-values-4/#viewport-relative-lengths?
- What's the financial outcome of https://bugs.webkit.org/show_bug.cgi?id=141832?
- See how much https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/BK0oHURgmJ4 makes per month
- How much does https://css-tricks.com/the-trick-to-viewport-units-on-mobile/ pull in monthly?
- https://stackoverflow.com/a/43575432 income
- https://chanind.github.io/javascript/2019/09/28/avoid-100vh-on-mobile-web.html income
- How much profit does https://drafts.csswg.org/css-env-1/#safe-area-insets generate?
- Get to know what's the income of https://www.githubstatus.com/
Analytics and Tracking {π}
- Site Verification - Google
Libraries {π}
- Clipboard.js
- D3.js
- Lodash
Emails and Hosting {βοΈ}
Mail Servers:
- aspmx.l.google.com
- alt1.aspmx.l.google.com
- alt2.aspmx.l.google.com
- alt3.aspmx.l.google.com
- alt4.aspmx.l.google.com
Name Servers:
- dns1.p08.nsone.net
- dns2.p08.nsone.net
- dns3.p08.nsone.net
- dns4.p08.nsone.net
- ns-1283.awsdns-32.org
- ns-1707.awsdns-21.co.uk
- ns-421.awsdns-52.com
- ns-520.awsdns-01.net