{"id":16247222,"url":"https://github.com/dotnetcarpenter/white-space","last_synced_at":"2025-07-11T19:38:34.706Z","repository":{"id":8138143,"uuid":"9556471","full_name":"dotnetCarpenter/white-space","owner":"dotnetCarpenter","description":"white-space: none polyfill","archived":false,"fork":false,"pushed_at":"2014-02-24T21:04:01.000Z","size":1568,"stargazers_count":22,"open_issues_count":3,"forks_count":2,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-06-17T13:07:26.088Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"wtfpl","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dotnetCarpenter.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2013-04-19T23:30:02.000Z","updated_at":"2023-10-27T22:49:00.000Z","dependencies_parsed_at":"2022-07-18T22:18:45.594Z","dependency_job_id":null,"html_url":"https://github.com/dotnetCarpenter/white-space","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"purl":"pkg:github/dotnetCarpenter/white-space","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotnetCarpenter%2Fwhite-space","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotnetCarpenter%2Fwhite-space/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotnetCarpenter%2Fwhite-space/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotnetCarpenter%2Fwhite-space/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dotnetCarpenter","download_url":"https://codeload.github.com/dotnetCarpenter/white-space/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dotnetCarpenter%2Fwhite-space/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264888356,"owners_count":23678792,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-10T14:36:21.052Z","updated_at":"2025-07-11T19:38:34.631Z","avatar_url":"https://github.com/dotnetCarpenter.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"``white-space: none;`` polyfill\n===============================\n\n## Polyfill for the proposed white-space:none; CSS property\n\n`white-space: none;` is a highly requested feature of the CSS Text Module but is, as time of writing, only recognized as [an issue in CSS Text Module Level 3 (Issue 3)](http://www.w3.org/TR/2012/WD-css3-text-20121113/#pre-line). *UPDATE* Issue 3 has since then been removed from the specs.\n\nOriginal written as a proof-of-concept, I've found `white-space: none;` really useful and it's now ready for development usage. You're probably better off using HTML comments, HTML minification or similar in production but for development, it's pretty *tight*.\n\nYou can find a list of sites and people discussing issues with not having `white-space: none;` on the [wiki](https://github.com/dotnetCarpenter/white-space/wiki).\n\n### UPDATE 2013-10-05 ###\nSince version 1.1.0 a `white-space-fast.js` is supplied. It comes with another caveat (see [Issues below](./#issues)), but should be fast enough to be used in production. Which means you don't don't have to fix your white space issues.\n`white-space-fast.min.js` should be placed inside your body tag to prevent it from running too soon on IE, on initial load with empty cache.\nI encourage you to experiement with the exact placement of `white-space-fast.min.js`, as slowly loading js files (jQuery ect.) will impact the perceived performance of this ``white-space: none;`` implementation. Feedback is welcome in the [issue tracker](https://github.com/dotnetCarpenter/white-space/issues). \n\n*`white-space-fast.js` doesn't support IE8.*\n\n## Usage\n**CSS**\n```css\n  .foo {\n    display: inline-block;\n    white-space: none; /* this is the API which removes white space based on your CSS selector */\n  }\n```\n\n**bower**\n```shell\nbower install css-white-space-none\n```\n\n```html\n\u003c!-- insert where ever you want --\u003e\n\u003cscript src=\"bower_components/css-white-space-none/white-space.min.js\"\u003e\u003c/script\u003e\n```\nOR\n```html\n\u003c!-- insert inside your body tag - since version 1.1.0 --\u003e\n\u003cscript src=\"bower_components/css-white-space-none/white-space-fast.min.js\"\u003e\u003c/script\u003e\n```\n\n### Listen for WhiteSpaceDone \u003csup\u003enot IE8\u003c/sup\u003e\nWhen the `white-space: none;` rule has been enforced, the parent element dispatch a `WhiteSpaceDone` event. You can listen on the document and use the target property to determine which elements children has `white-space: none;` applied.\n\n```javascript\n// always attach event listeners before they can be triggered to avoid race conditions,\n// e.g. this snippet should be before you include white-space-fast.js\ndocument.addEventListener(\"WhiteSpaceDone\", function(e) {\n  console.dir(e.target);\n}, true); // set useCapture to true if you're not listening on the element dispatching WhiteSpaceDone\n```\n\n## Size\n+ `white-space.min.js` 2050 bytes (minified)\n+ `white-space.min.js.gz` 1044 bytes (gzipped)\n+ `white-space-fast.min.js` 1991 bytes (minified)\n+ `white-space-fast.min.js.gz` 1043 bytes (gzipped)\n\n## Issues\n`white-space: none;` comes with a few known limitations, you need to cater for.\n\n1. Don't use `white-space: none;` inside @media queries - unless you want to apply `white-space: none;` to the selector regardless of your media query.\n2. Only use `white-space: none;` in external style sheets - the script won't look anywhere else.\n3. If your external style sheet is on a different domain, make sure you use [CORS](http://www.w3.org/TR/cors/).\n\nLet me know, in the [issue tracker](https://github.com/dotnetCarpenter/white-space/issues), if you stumble upon anything weird.\n\n## Implementation\nThe implementation works by removing empty nodes in the DOM, that are siblings to a node with ``white-space: none;``. The child nodes doesn't inherit ``white-space: none;``.\nFurthermore, this polyfill only parse external CSS. So it won't even look at CSS in the header or inline.\n`white-space-fast.js` calls the removal of empty DOM nodes on `document.readyState == 'interactive'` as oppose to `white-space.js`, which remove empty DOM nodes on `document.readyState == 'complete'`.\nVersion 1.1.1 also test for `document.readyState == 'loaded'`.\n\n## Tests\n\nI decided to include a realistic use-case, which really isn't a test-case but included as such, because\nit's useful to test `white-space: none;` in a realistic environment.\nSo far there is one use case, three test cases and one test case that include all three:\n\n+ [unordered-list.html](http://dotnetcarpenter.github.io/white-space/test-cases/unordered-list.html)*\n+ [images-as-list.html](http://dotnetcarpenter.github.io/white-space/test-cases/images-as-list.html)*\n+ [trebuchet-overflow.html](http://dotnetcarpenter.github.io/white-space/test-cases/trebuchet-overflow.html)\n+ [all.html](http://dotnetcarpenter.github.io/white-space/test-cases/all.html)\n+ [real.html](http://dotnetcarpenter.github.io/white-space/test-cases/real.html)\n\n**white-space-fast.js**\n+ [unordered-list.html](http://dotnetcarpenter.github.io/white-space/test-cases/white-space-fast/unordered-list.html)*\n+ [images-as-list.html](http://dotnetcarpenter.github.io/white-space/test-cases/white-space-fast/images-as-list.html)*\n+ [trebuchet-overflow.html](http://dotnetcarpenter.github.io/white-space/test-cases/white-space-fast/trebuchet-overflow.html)\n+ [all.html](http://dotnetcarpenter.github.io/white-space/test-cases/white-space-fast/all.html)\n+ [real.html](http://dotnetcarpenter.github.io/white-space/test-cases/white-space-fast/real.html)\n\n\\* Click the \"Run white-space:none; script\" button at the top\n\n## Tested in\n+ FF25, FF24, Chr30, IE10, IE9, IE8 on Win7 (`white-space-fast.js` doesn't support IE8)\n+ IE10, IE9, IE8 on Win8 (`white-space-fast.js` doesn't support for IE8)\n+ FF24, FF21, Saf7, Saf6, Chr30, Chr27, Op17, Op12 on OSX10.7 (Lion)\n+ Internet (android stock browser) 4.0.4, Dolfin 10.1, FF24, Chr30, Op12.1.4 on Android 4.0.4\n+ Internet (android stock browser) 2.3 on Android 2.3.7\n+ Saf6 on iOS 6.1.3\n\n**NOTE:** IE7 support requires that `querySelectorAll` is replaced with something similar.\n\n## Discussion\n+ http://lists.w3.org/Archives/Public/www-style/2013Mar/subject.html#msg756\n+ http://lists.w3.org/Archives/Public/www-style/2013Apr/subject.html#msg497\n\n### Changelog\n+ 1.2.2 - A debug statement slipped into `white-space-fast.js` - it's now removed\n+ 1.2.1 - Fixed removal of white-space prematuraly in IE9 for `white-space-fast.js` (see [#5](https://github.com/dotnetCarpenter/white-space/issues/5))\n+ 1.2.0 - Fires *WhiteSpaceDone* on parent element when white space is removed, fix bug where ajax call was made to *none* when the document contain \\\u003cstyle\\\u003e element(s), added gzipped versions\n+ 1.1.1 - fix DOM ready detection for Android 2.3\n+ 1.1.0 - New white-space-fast.js implementation\n+ 1.0.1 - handle css without selectors\n+ 1.0.0 - first public release\n+ 0.4.0 - build system and bower support - faulty release, as bower support didn't work\n+ 0.3.1 - fix event listeners overwriting each other\n+ 0.3.0 - DOMready feature, improved CSS tokenizer, better IE8 handling and a new use-case (real.html)\n+ 0.2.2 - exclude @charset declaration kind of rules and fixed broken selector when `;` was missing at the end of the `white-space:none;` declaration (e.i. when minified).\n+ 0.2.1 - excluding comments when looking for `white-space: none;`\n+ 0.2.0 - added support for IE8\n+ 0.1.2 - fix bug when no `white-space:none` was found in CSS\n+ 0.1.1 - switch to monadish implementation\n+ 0.1.0 - proof of concept\n\nCopyright © 2013 Jon Ege Ronnenberg\nThis work is free. You can redistribute it and/or modify it under the\nterms of the Do What The Fuck You Want To Public License, Version 2,\nas published by Sam Hocevar. See \u003cLICENSE\u003e for more details.\n\n[![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/dotnetCarpenter/white-space/trend.png)](https://bitdeli.com/free \"Bitdeli Badge\")\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdotnetcarpenter%2Fwhite-space","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdotnetcarpenter%2Fwhite-space","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdotnetcarpenter%2Fwhite-space/lists"}