Skip to content
This repository

viewport units test #572

Closed
paulirish opened this Issue April 30, 2012 · 12 comments

7 participants

Paul Irish Sindre Sorhus Chris Coyier Ryan Seddon Travis Northcutt FWeinb Guo Lin
Paul Irish
Owner

via @chriscoyier

basicallly 100vw == window.width

test to be written for real.

Chris Coyier

Yay. There is a real use-case I think especially now that it's shipping in Chrome 20 & IE 10.

If support, use.
If no support, polyfill with FitText.js

Ryan Seddon
Owner

IE9 and maybe 10 interpret 1vw as the full width and not 1/100th of the width.

http://jsfiddle.net/ryanseddon/x4jA9/

Chris Coyier

It was fixed in 10, in my testing. This is kind of a disaster though. Maybe Modernizr should just report no support for IE 9? Or would you do tweener/broken support like .viewportunits-100x

Travis Northcutt

+1 for reporting no support in IE 9, at least initially.

Ryan Seddon
Owner

@chriscoyier yeah I reckon just say no support for IE9 since it's a broken implementation anyway. Your proposed test will fail in IE9 so that should be fine.

I modified my testcase based of your idea to test for 50vw width as it would false positive in Firefox doing 100vw as the div it injected would naturally be the full window width too.

http://jsfiddle.net/ryanseddon/x4jA9/12/

This is false in IE9 and true in Chrome 20 and IE10

FWeinb
FWeinb commented May 03, 2012

@ryanseddon if window.innerWidth is odd it won't work because getComputedStyle(elem, null)['width'] is rounded down.

This might be better: http://jsfiddle.net/FWeinb/etnYC/

(Tested in Chrome 20)

Ryan Seddon
Owner

@FWeinb is anything changed I don't see any difference in the link?

FWeinb
FWeinb commented May 04, 2012

@ryanseddon Sorry I didn't saved it. I wrapped the window.innerWidth/2 with parseInt() to equally round it down.

Ryan Seddon
Owner

Ok awesome, does someone want to put a pull request together?

Paul Irish
Owner

@sguolin want to take a shot at the PR for this?

Guo Lin
glsee commented July 20, 2012

Yeah, sure! Kindly review: #638
P/S: changed my username from @sguolin recently.

Sindre Sorhus sindresorhus closed this January 24, 2013
Sindre Sorhus
Collaborator

Fixed in #638

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.