Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

roundBeforeSet not working #10

Closed
d4tocchini opened this issue Feb 12, 2014 · 5 comments
Closed

roundBeforeSet not working #10

d4tocchini opened this issue Feb 12, 2014 · 5 comments

Comments

@d4tocchini
Copy link
Member

an easy fix...

@d4tocchini
Copy link
Member Author

Config property changed to fractionalPixels and currently defaults to true

@gcox
Copy link

gcox commented Feb 28, 2014

This has no effect for me. I ran into the blurry text (an obvious deal breaker) issue immediately after trying GSS.

Just centering text, be it in a P or SPAN tag, within some other element results in blurry text depending on your browser's window size. If your browser window happens to be the correct size, the text will be crisp, otherwise it will be blurry.

Setting fractionalPixels to false does not correct the problem as expected.

I'm testing this in the latest version of Chrome using the latest build (from the link on your website). Perhaps I'm doing something wrong?

<html>
    <head>
        <title></title>
        <script>
            GSS_CONFIG = {
                worker: "gss/worker.min.js",
                fractionalPixels: false
            }
        </script>
        <script src="gss/gss.min.js"></script>
        <style type="text/gss">
            @horizontal |[#div1]| in(::window);
            @vertical |[#div1]| in(::window);

            #p1[center-x] == #div1[center-x];
            #p1[center-y] == #div1[center-y];
            #p1[width] == #p1[intrinsic-width];
            #p1[height] == #p1[intrinsic-height];
        </style>
    </head>
    <body class="body">
        <div id="div1">
            <p id="p1">Text inside Div 1</p>
        </div>
    </body>
</html>

@d4tocchini
Copy link
Member Author

Have you updated the gss lib recently?

Are the computed values being rounded but things still look blurry, or are you seeing decimals in the elements' width, height or matrix3d transform?

The GSS website uses this config, and it is working correctly. If, for example, you inspect the top buttons and change window size, you'll notice the generated styles all use whole values. W/o this config, the button text is noticeably blurry...

@gcox
Copy link

gcox commented Feb 28, 2014

I downloaded dist.zip this morning (following the link from the Install section of the GSS website).

I'm seeing decimals in the matrix3d transform of the P tag.

<p id="p1" data-gss-id="p1" style="box-sizing: border-box; position: absolute; margin: 0px; top: 0px; left: 0px; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 638.5, 478, 0, 1);">Text inside Div 1</p>

@gcox
Copy link

gcox commented Mar 2, 2014

@d4tocchini FYI, your updates to the website yesterday updated the link for downloading the latest release, which this problem is fixed in. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants