Channel preview displays incorrectly

Description

Channel preview displays incorrectly in CMS. There is a problem with element's width detection in browsers.

The first situation reproduces in all browsers.
Steps to reproduce:

1. Add a channel with a width of 768px.
2. Assume you have a page with some css: @media only screen and (max-width: 767px) {/*apply some css*/ }

   . This means that specified css should only be applied if the width is less than 767px.

3. Choose page preview in the added resolution.
4. The new css is applied but should not be.

The second situation reproduces in Firefox.
Steps to reproduce:

1. Add a channel with a width of 1024px.
2. Assume you have a page with this css: @media (max-width:1010px). # { /*apply some css*/ }

   . This means that specified css should only be applied if width is less than 1010px.

3. Choose page preview in the added resolution.
4. The new css is applied, but shouldn't be.

Expected: New css should not be applied.
Actual: New css is applied.