# 1px bug based on window size **URL:** \ **Category:** Extensions\ **Created:** [April 24, 2018, 10:40pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471 "2018-04-24T22:40:57Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![Dustin\_Wang](https://avatars.discourse-cdn.com/v4/letter/d/b487fb/32.png) [@Dustin\_Wang](https://discuss.dev.twitch.com/u/Dustin_Wang)\ **Post date:** [April 24, 2018, 10:40pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/1 "2018-04-24T22:40:57Z")
Having some trouble debugging this… I keep getting this 1px edge that pops out depending on the resolution of my html5 extension window. Attached is an example: ![chrome_2018-04-24_15-33-48](https://d2opxh93rbxzdn.cloudfront.net/original/2X/b/ba2b6d7f0bf73a41d6e5f4a28213de5a073c34ad.png) Some times that border isn’t there: ![chrome_2018-04-24_15-34-11](https://d2opxh93rbxzdn.cloudfront.net/original/2X/4/4ce16ea94c64deeb5fc43bc71ba6bac91d4d6eca.png) I’m not exactly sure what’s causing it, I had a suspicion that it was an issue with how I implement widths/heights (I’m using %s), but it seems to affect the whole iframe. I’m guessing at certain aspect ratios, the iframe bugs out. Is this just a bug I have to live with? Seems consistent across other browsers. ---
**Author:** ![Dustin\_Wang](https://avatars.discourse-cdn.com/v4/letter/d/b487fb/32.png) [@Dustin\_Wang](https://discuss.dev.twitch.com/u/Dustin_Wang)\ **Post date:** [April 24, 2018, 10:49pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/2 "2018-04-24T22:49:46Z")
Changing the margins fixes/hides it, but obviously I can’t affect iframe from the extension… ---
**Author:** ![Born2Phil](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/born2phil/32/5916_2.png) [@Born2Phil](https://discuss.dev.twitch.com/u/Born2Phil)\ **Post date:** [April 25, 2018, 1:32pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/3 "2018-04-25T13:32:40Z")
@Dustin_Wang I have a suspicion that is related to this -\> [CSS transform on overlay extensions causes issues](https://discuss.dev.twitch.com/t/css-transform-on-overlay-extensions-causes-issues/14083) TLDR; Inspect the \
**Author:** ![Dustin\_Wang](https://avatars.discourse-cdn.com/v4/letter/d/b487fb/32.png) [@Dustin\_Wang](https://discuss.dev.twitch.com/u/Dustin_Wang)\ **Post date:** [April 25, 2018, 8:35pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/4 "2018-04-25T20:35:40Z")
@Born2Phil Thanks! Definitely something related to using css transforms. Though I’m curious why transform properties on the child, somehow affect the parent div/iframe… A cursory google search shows that %s transforms are probably the culprit. I’m guessing a ton of fractional values are bugging out… I’d like to continue using transforms (I use them for animations), I guess I’ll have to step away from edge touching extensions until I can figure out a fix. ---
**Author:** ![Born2Phil](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/born2phil/32/5916_2.png) [@Born2Phil](https://discuss.dev.twitch.com/u/Born2Phil)\ **Post date:** [April 25, 2018, 9:29pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/5 "2018-04-25T21:29:22Z")
@Dustin_Wang Transformations on child elements does not affect the parent it’s the other way around. You are exactly right that %s transforms could result in element dimensions with a fraction or so called half pixel which the browser display as semi-transparent. The problem is not from your code It’s coming from the 50% translation that Twitch applies to the wrapper of the iframe which holds your code and therefore propagates and creates dimensions with a fraction. At the moment nobody has come to explain why this 50% translation is applied in the first place. It’s a minor visual bug and my guess is that twitch devs have more important work to do but hopefully they will address this problem at some point. ---
**Author:** ![Dustin\_Wang](https://avatars.discourse-cdn.com/v4/letter/d/b487fb/32.png) [@Dustin\_Wang](https://discuss.dev.twitch.com/u/Dustin_Wang)\ **Post date:** [April 25, 2018, 9:50pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/6 "2018-04-25T21:50:12Z")
@Born2Phil I see. I had thought that it shifted the whole iframe. I assume twitch added the 50% to center the whole iframe (since that’s how you typically center things within a div). Possible workaround I can think of is detecting a fractional dimension case, and round up. Not ideal, but I think it’ll work. ---
**Author:** ![Born2Phil](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/born2phil/32/5916_2.png) [@Born2Phil](https://discuss.dev.twitch.com/u/Born2Phil)\ **Post date:** [April 25, 2018, 10:21pm UTC](https://discuss.dev.twitch.com/t/1px-bug-based-on-window-size/15471/7 "2018-04-25T22:21:41Z")
Yeah it could be for positioning but the iframe has 100% width and height so to me it doesn’t make much sense to be the case, also there are other ways for positioning not involving transformation.