From e07a87f7e8c8150cb77729b10157d214f935601a Mon Sep 17 00:00:00 2001 From: OnkarRuikar <87750369+OnkarRuikar@users.noreply.github.com> Date: Mon, 23 Sep 2024 08:53:26 +0530 Subject: [PATCH] fix ignored typos due to 'allowCompoundWords:true' setting --- files/en-us/learn/forms/user_input_methods/index.md | 2 +- .../react_resources/index.md | 2 +- .../vue_getting_started/index.md | 2 +- .../introducing_complete_toolchain/index.md | 2 +- .../aria/attributes/aria-brailleroledescription/index.md | 2 +- .../web/api/animationplaybackevent/currenttime/index.md | 4 ++-- files/en-us/web/api/bluetooth/requestdevice/index.md | 2 +- files/en-us/web/api/canvasrenderingcontext2d/arcto/index.md | 4 ++-- files/en-us/web/api/clipboard/write/index.md | 2 +- files/en-us/web/api/compute_pressure_api/index.md | 4 ++-- files/en-us/web/api/console/index.md | 2 +- .../api/credential_management_api/credential_types/index.md | 2 +- files/en-us/web/api/customstateset/index.md | 4 ++-- .../dedicatedworkerglobalscope/rtctransform_event/index.md | 2 +- files/en-us/web/api/featurepolicy/allowsfeature/index.md | 2 +- files/en-us/web/api/htmlinputelement/checkvalidity/index.md | 2 +- .../en-us/web/api/htmlinputelement/reportvalidity/index.md | 2 +- files/en-us/web/api/htmllinkelement/crossorigin/index.md | 2 +- files/en-us/web/api/htmlmediaelement/crossorigin/index.md | 2 +- files/en-us/web/api/htmlmeterelement/min/index.md | 2 +- files/en-us/web/api/htmlscriptelement/crossorigin/index.md | 2 +- .../en-us/web/api/htmlscriptelement/fetchpriority/index.md | 2 +- files/en-us/web/api/identityprovider/index.md | 2 +- files/en-us/web/api/mediakeys/getstatusforpolicy/index.md | 2 +- files/en-us/web/api/mediakeys/index.md | 2 +- files/en-us/web/api/mediarecorder/start/index.md | 2 +- files/en-us/web/api/pictureinpicturewindow/width/index.md | 2 +- files/en-us/web/api/publickeycredential/tojson/index.md | 2 +- files/en-us/web/api/rtcencodedaudioframe/index.md | 2 +- files/en-us/web/api/rtcencodedvideoframe/index.md | 2 +- files/en-us/web/api/svglengthlist/index.md | 2 +- files/en-us/web/api/view_transitions_api/using/index.md | 2 +- files/en-us/web/api/wakelock/request/index.md | 2 +- .../web/api/webrtc_api/using_encoded_transforms/index.md | 6 +++--- files/en-us/web/css/@counter-style/speak-as/index.md | 2 +- files/en-us/web/css/@import/index.md | 2 +- files/en-us/web/css/content/index.md | 2 +- files/en-us/web/css/css_colors/color_values/index.md | 2 +- files/en-us/web/css/css_properties_and_values_api/index.md | 2 +- files/en-us/web/css/css_shapes/overview_of_shapes/index.md | 2 +- files/en-us/web/css/marker-mid/index.md | 2 +- files/en-us/web/css/marker/index.md | 2 +- files/en-us/web/css/position-anchor/index.md | 2 +- files/en-us/web/css/position-area_value/index.md | 4 ++-- files/en-us/web/css/stroke-dasharray/index.md | 2 +- files/en-us/web/css/stroke-dashoffset/index.md | 2 +- files/en-us/web/css/stroke-width/index.md | 2 +- files/en-us/web/css/zoom/index.md | 2 +- files/en-us/web/html/attributes/rel/prerender/index.md | 2 +- files/en-us/web/html/element/datalist/index.md | 2 +- files/en-us/web/html/global_attributes/exportparts/index.md | 2 +- .../headers/attribution-reporting-register-source/index.md | 2 +- files/en-us/web/http/headers/report-to/index.md | 2 +- files/en-us/web/http/status/421/index.md | 2 +- .../web/javascript/reference/errors/not_a_function/index.md | 2 +- .../javascript/reference/errors/regex_raw_bracket/index.md | 2 +- .../javascript/reference/errors/unexpected_token/index.md | 2 +- .../web/javascript/reference/global_objects/set/index.md | 2 +- .../reference/global_objects/set/issubsetof/index.md | 2 +- files/en-us/web/mathml/element/mfenced/index.md | 2 +- files/en-us/web/performance/speculative_loading/index.md | 2 +- files/en-us/web/privacy/third-party_cookies/index.md | 2 +- 62 files changed, 69 insertions(+), 69 deletions(-) diff --git a/files/en-us/learn/forms/user_input_methods/index.md b/files/en-us/learn/forms/user_input_methods/index.md index 70718f7a9bfb7b3..7f7201fa318830a 100644 --- a/files/en-us/learn/forms/user_input_methods/index.md +++ b/files/en-us/learn/forms/user_input_methods/index.md @@ -92,7 +92,7 @@ When screen orientation matters for your form, you can read the screen orientati ### Fullscreen -If you need to present your form in fullscreen mode, such as when your form is displayed on a museum kiosk, toll booth, or really any publically displayed user interface, it is possible to do so by calling {{domxref("Element.requestFullscreen()")}} on that element: +If you need to present your form in fullscreen mode, such as when your form is displayed on a museum kiosk, toll booth, or really any publicly displayed user interface, it is possible to do so by calling {{domxref("Element.requestFullscreen()")}} on that element: ```js const elem = document.getElementById("myForm"); diff --git a/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/react_resources/index.md b/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/react_resources/index.md index 90d25d8f9f7b31f..54c84181637ab5e 100644 --- a/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/react_resources/index.md +++ b/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/react_resources/index.md @@ -99,6 +99,6 @@ While routing is traditionally handled by a server and not an application on the [React Router](https://reactrouter.com/) is the most popular and most robust client-side routing library for React. It allows developers to define the routes of their application, and associate components with those routes . It also provides a number of useful hooks and components for managing the browser's location and history. > [!NOTE] -> Client-side routing can make your application feel fast, but it poses a number of accessibility problems, especially for people who rely on assistive techology. You can read more about this in Marcy Sutton's article, ["The Implications of Client-Side Routing"](https://testingaccessibility.com/implications-of-client-side-routing). +> Client-side routing can make your application feel fast, but it poses a number of accessibility problems, especially for people who rely on assistive technology. You can read more about this in Marcy Sutton's article, ["The Implications of Client-Side Routing"](https://testingaccessibility.com/implications-of-client-side-routing). {{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}} diff --git a/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.md b/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.md index 46aec98b139c6d6..0ce93a87c05a551 100644 --- a/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.md +++ b/files/en-us/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.md @@ -99,7 +99,7 @@ We'll step through the options in the initialization steps below. To explore various features of Vue, we will be building up a sample todo list app. We'll begin by using `create-vue` to build a new scaffold for our app. In terminal, `cd` to where you'd like to create your sample app, then run `npm create vue@latest` (or `yarn create vue@latest` if you prefer Yarn). -The interactive tool let's you choose some options and you can procees by pressing Enter. +The interactive tool let's you choose some options and you can proceed by pressing Enter. For this project, we'll use the following configuration: ```plain diff --git a/files/en-us/learn/tools_and_testing/understanding_client-side_tools/introducing_complete_toolchain/index.md b/files/en-us/learn/tools_and_testing/understanding_client-side_tools/introducing_complete_toolchain/index.md index 6c86b0bcd6194ec..91f1515e7b25439 100644 --- a/files/en-us/learn/tools_and_testing/understanding_client-side_tools/introducing_complete_toolchain/index.md +++ b/files/en-us/learn/tools_and_testing/understanding_client-side_tools/introducing_complete_toolchain/index.md @@ -229,7 +229,7 @@ ESLint is installed via npm, so as per discussions in Chapter 2, you have the ch npm install --save-dev eslint@8 @eslint/js globals ``` -> **Note:** `esling@8` installs the version 8 of ESLint, while the latest is v9. This is because `eslint-plugin-react`, which we will use later, [does not support v9 yet](https://github.com/jsx-eslint/eslint-plugin-react/issues/3699). +> **Note:** `eslint@8` installs the version 8 of ESLint, while the latest is v9. This is because `eslint-plugin-react`, which we will use later, [does not support v9 yet](https://github.com/jsx-eslint/eslint-plugin-react/issues/3699). The `@eslint/js` package provides predefined ESLint configuration, while the `globals` package provides a list of known global names in each environment. We will use them later in the configuration. Out of the box, ESLint is going to complain that it can't find the configuration file if you run it with `npx eslint`: diff --git a/files/en-us/web/accessibility/aria/attributes/aria-brailleroledescription/index.md b/files/en-us/web/accessibility/aria/attributes/aria-brailleroledescription/index.md index fa56277c89eae53..7ce21ddaeda1c1a 100644 --- a/files/en-us/web/accessibility/aria/attributes/aria-brailleroledescription/index.md +++ b/files/en-us/web/accessibility/aria/attributes/aria-brailleroledescription/index.md @@ -39,7 +39,7 @@ A few rules to remember: - Only apply `aria-brailleroledescription` to elements with a valid ARIA role or elements with implicit role semantics. - The `aria-brailleroledescription`, if present, must have a non-empty, none null value that is different from the `aria-roledescription` value, which, in turn, is different from the ARIA explicit or role or implicit semantic role. -- Avoid using Unicode Braille Patterns. If they must be used, ensure the `aria-brailleroledescription` value contains content other than unicode braille patterns, whitespace, and braille battern dots-0. +- Avoid using Unicode Braille Patterns. If they must be used, ensure the `aria-brailleroledescription` value contains content other than unicode braille patterns, whitespace, and braille pattern dots-0. - Ensure the value is always localized to the document's language. > [!WARNING] diff --git a/files/en-us/web/api/animationplaybackevent/currenttime/index.md b/files/en-us/web/api/animationplaybackevent/currenttime/index.md index b99992ade39006d..703a7031efa5bfb 100644 --- a/files/en-us/web/api/animationplaybackevent/currenttime/index.md +++ b/files/en-us/web/api/animationplaybackevent/currenttime/index.md @@ -16,9 +16,9 @@ A number representing the current time in milliseconds, or `null`. ## Reduced time precision -To offer protection against timing attacks and [fingerprinting](/en-US/docs/Glossary/Fingerprinting), the precision of `platbackEvent.currentTime` might get rounded depending on browser settings. In Firefox, the `privacy.reduceTimerPrecision` preference is enabled by default and defaults to 2ms. You can also enable `privacy.resistFingerprinting`, in which case the precision will be 100ms or the value of `privacy.resistFingerprinting.reduceTimerPrecision.microseconds`, whichever is larger. +To offer protection against timing attacks and [fingerprinting](/en-US/docs/Glossary/Fingerprinting), the precision of `playbackEvent.currentTime` might get rounded depending on browser settings. In Firefox, the `privacy.reduceTimerPrecision` preference is enabled by default and defaults to 2ms. You can also enable `privacy.resistFingerprinting`, in which case the precision will be 100ms or the value of `privacy.resistFingerprinting.reduceTimerPrecision.microseconds`, whichever is larger. -For example, with reduced time precision, the result of `platbackEvent.currentTime` will always be a multiple of 0.002, or a multiple of 0.1 (or `privacy.resistFingerprinting.reduceTimerPrecision.microseconds`) with `privacy.resistFingerprinting` enabled. +For example, with reduced time precision, the result of `playbackEvent.currentTime` will always be a multiple of 0.002, or a multiple of 0.1 (or `privacy.resistFingerprinting.reduceTimerPrecision.microseconds`) with `privacy.resistFingerprinting` enabled. ```js // reduced time precision (2ms) in Firefox 60 diff --git a/files/en-us/web/api/bluetooth/requestdevice/index.md b/files/en-us/web/api/bluetooth/requestdevice/index.md index bb4cdd371ec3486..2c4e2fc03d9fd25 100644 --- a/files/en-us/web/api/bluetooth/requestdevice/index.md +++ b/files/en-us/web/api/bluetooth/requestdevice/index.md @@ -54,7 +54,7 @@ requestDevice(options) - `companyIdentifier` - : A mandatory number identifying the manufacturer of the device. Company identifiers are listed in the Bluetooth specification [Assigned numbers](https://www.bluetooth.com/specifications/assigned-numbers/), Section 7. - For example, to match against devices manufacturered by "Digianswer A/S", with assigned hex number `0x000C`, you would specify `12`. + For example, to match against devices manufactured by "Digianswer A/S", with assigned hex number `0x000C`, you would specify `12`. - `dataPrefix` {{optional_inline}} - : The data prefix. A buffer containing values to match against the values at the start of the advertising manufacturer data. diff --git a/files/en-us/web/api/canvasrenderingcontext2d/arcto/index.md b/files/en-us/web/api/canvasrenderingcontext2d/arcto/index.md index f85e9779d7db650..21932c9bdba298b 100644 --- a/files/en-us/web/api/canvasrenderingcontext2d/arcto/index.md +++ b/files/en-us/web/api/canvasrenderingcontext2d/arcto/index.md @@ -724,7 +724,7 @@ can be used to change an underlined element that is in focus. function drawCanvas() { const rPoint = 4; const colorConstruction = "#080"; - const colorDragable = "#00F"; + const colorDraggable = "#00F"; const [P0, P1, P2] = state.controlPoints; ctx.font = "italic 14pt sans-serif"; @@ -783,7 +783,7 @@ can be used to change an underlined element that is in focus. state.controlPoints.forEach((value) => { ctx.beginPath(); ctx.arc(value.x, value.y, rPoint, 0, 2 * Math.PI); - ctx.fillStyle = colorDragable; + ctx.fillStyle = colorDraggable; ctx.fill(); }); ctx.fillStyle = "#000"; diff --git a/files/en-us/web/api/clipboard/write/index.md b/files/en-us/web/api/clipboard/write/index.md index 17e08762f6c334b..7addbf3ac671b59 100644 --- a/files/en-us/web/api/clipboard/write/index.md +++ b/files/en-us/web/api/clipboard/write/index.md @@ -201,7 +201,7 @@ img { #### Result The result is shown below. -First click on the blue square, and then select the text "Paste here" and use your OS-specific keyboard combinatations to paste from the clipboard (such as `Ctrl+V` on Windows). +First click on the blue square, and then select the text "Paste here" and use your OS-specific keyboard combinations to paste from the clipboard (such as `Ctrl+V` on Windows). {{embedlivesample("write_canvas_contents_to_the_clipboard", "", "420", "", "", "", "clipboard-write")}} diff --git a/files/en-us/web/api/compute_pressure_api/index.md b/files/en-us/web/api/compute_pressure_api/index.md index cd3d8911e08a63b..c73fba53a4cef82 100644 --- a/files/en-us/web/api/compute_pressure_api/index.md +++ b/files/en-us/web/api/compute_pressure_api/index.md @@ -28,7 +28,7 @@ Fast and delightful web applications should balance workloads when the system's ### Pressure source types -In your web app or website, different tasks are fighting for the processing time of different processing units (CPU, GPU, and other specialized proccessing units). The current version of the Compute Pressure API specification defines two main source types that can be queried to gather pressure information: +In your web app or website, different tasks are fighting for the processing time of different processing units (CPU, GPU, and other specialized processing units). The current version of the Compute Pressure API specification defines two main source types that can be queried to gather pressure information: - `"thermals"` represents the global thermal state of the entire system. - `"cpu"` represents the average pressure of the central processing unit (CPU) across all its cores. This state can be affected by other apps and sites than the observing site. @@ -112,4 +112,4 @@ try { ## See also -- [Compute Pressure demo](https://w3c.github.io/compute-pressure/demo/), which uses Mandelbrot sets and workers to create artifical pressure for test purposes. +- [Compute Pressure demo](https://w3c.github.io/compute-pressure/demo/), which uses Mandelbrot sets and workers to create artificial pressure for test purposes. diff --git a/files/en-us/web/api/console/index.md b/files/en-us/web/api/console/index.md index 00290d2583e8cd6..cd3027dee754040 100644 --- a/files/en-us/web/api/console/index.md +++ b/files/en-us/web/api/console/index.md @@ -147,7 +147,7 @@ The first parameter to the logging methods can be a string containing zero or mo - `%c` - : Applies CSS style rules to all following text. See [Styling console output](#styling_console_output). -Some browsers may implement additional format specifiers. For example, Safari and Firefox support the C-style precision formating `%.f`. For example `console.log("Foo %.2f", 1.1)` will output the number to 2 decimal places: `Foo 1.10`, while `console.log("Foo %.2d", 1.1)` will output the number as two significant figures with a leading 0: `Foo 01`. +Some browsers may implement additional format specifiers. For example, Safari and Firefox support the C-style precision formatting `%.f`. For example `console.log("Foo %.2f", 1.1)` will output the number to 2 decimal places: `Foo 1.10`, while `console.log("Foo %.2d", 1.1)` will output the number as two significant figures with a leading 0: `Foo 01`. Each of these pulls the next argument after the format string off the parameter list. For example: diff --git a/files/en-us/web/api/credential_management_api/credential_types/index.md b/files/en-us/web/api/credential_management_api/credential_types/index.md index e50d788afc926a6..715fa747316ee63 100644 --- a/files/en-us/web/api/credential_management_api/credential_types/index.md +++ b/files/en-us/web/api/credential_management_api/credential_types/index.md @@ -38,7 +38,7 @@ Modern browsers provide users with a password manager, which enables users to st In the Credential Management API, a password is represented by the {{domxref("PasswordCredential")}} interface. When a user successfully registers for or signs into your site, you can call the {{domxref("PasswordCredential.PasswordCredential()", "PasswordCredential()")}} constructor or {{domxref("CredentialsContainer.create", "navigator.credentials.create()")}} to create a `PasswordCredential` object from the credentials the user entered. You can then pass this into {{domxref("CredentialsContainer.store", "navigator.credentials.store()")}}, and the browser will ask the user if they want to store the password in the password manager. -![Sequence diagram showing creation and storage of a pasword credential.](password-create.svg) +![Sequence diagram showing creation and storage of a password credential.](password-create.svg) When a user visits your site, you can call {{domxref("CredentialsContainer.get", "navigator.credentials.get()")}} to retrieve a stored password for your site, and use it to log the user in. Depending on the situation, you can log the user in silently or use the returned password to auto-fill a form field. diff --git a/files/en-us/web/api/customstateset/index.md b/files/en-us/web/api/customstateset/index.md index fd3a4a4c041a8ec..69607523fc68f93 100644 --- a/files/en-us/web/api/customstateset/index.md +++ b/files/en-us/web/api/customstateset/index.md @@ -79,7 +79,7 @@ Additionally, the `:state()` pseudo-class can be used after the [`::part()`](/en > [!WARNING] > Browsers that do not yet support [`:state()`](/en-US/docs/Web/CSS/:state) will use a CSS `` for selecting custom states, which is now deprecated. -> For information about how to support both approaches see the [Compatibility with `` syntax](#compability_with_dashed-ident_syntax) section below. +> For information about how to support both approaches see the [Compatibility with `` syntax](#compatibility_with_dashed-ident_syntax) section below. ## Examples @@ -485,7 +485,7 @@ Click the element to see a different border being applied as the state changes. {{EmbedLiveSample("Non-boolean internal states", "100%", 50)}} -## Compability with `` syntax +## Comptability with `` syntax Previously custom elements with custom states were selected using a `` instead of the [`:state()`](/en-US/docs/Web/CSS/:state) function. Browser versions that don't support `:state()` will throw an error when supplied with an ident that is not prefixed with the double dash. diff --git a/files/en-us/web/api/dedicatedworkerglobalscope/rtctransform_event/index.md b/files/en-us/web/api/dedicatedworkerglobalscope/rtctransform_event/index.md index 4055135873b0132..f4af4ac2318b46d 100644 --- a/files/en-us/web/api/dedicatedworkerglobalscope/rtctransform_event/index.md +++ b/files/en-us/web/api/dedicatedworkerglobalscope/rtctransform_event/index.md @@ -62,7 +62,7 @@ addEventListener("rtctransform", (event) => { The `rtctransform` event is fired when an encoded frame is enqueued on the {{domxref("RTCRtpScriptTransformer")}} and just once when the transformer's corresponding {{domxref("RTCRtpScriptTransformer")}} is constructed. The code first determines what transform to apply using `name` value passed in the options (this allows {{domxref("RTCRtpScriptTransform")}} instances added to the incoming and outgoing WebRTC pipelines to share a single worker). Encoded frames are then piped from the readable, through the selected transform {{domxref("TransformStream")}}, to a writeable. -The actual tranforming code is not shown. +The actual transforming code is not shown. Note that this code is part of a more complete example provided in {{domxref("WebRTC API/Using Encoded Transforms", "Using WebRTC Encoded Transforms", "", "nocode")}}. diff --git a/files/en-us/web/api/featurepolicy/allowsfeature/index.md b/files/en-us/web/api/featurepolicy/allowsfeature/index.md index e05cedfe914bf8e..9b0d56d648bee35 100644 --- a/files/en-us/web/api/featurepolicy/allowsfeature/index.md +++ b/files/en-us/web/api/featurepolicy/allowsfeature/index.md @@ -28,7 +28,7 @@ allowsFeature(feature, origin) - `feature` - : The specific feature name to check its availability. - `origin` {{Optional_inline}} - - : The specific origin name to check its availability. If not specificed, the default origin will be used. + - : The specific origin name to check its availability. If not specified, the default origin will be used. ### Return value diff --git a/files/en-us/web/api/htmlinputelement/checkvalidity/index.md b/files/en-us/web/api/htmlinputelement/checkvalidity/index.md index d7f4cff88bb1aba..490420f96a19de3 100644 --- a/files/en-us/web/api/htmlinputelement/checkvalidity/index.md +++ b/files/en-us/web/api/htmlinputelement/checkvalidity/index.md @@ -68,7 +68,7 @@ checkButton.addEventListener("click", () => { {{EmbedLiveSample("Examples", "100%", 220)}} -When `false`, if the value is missing, below 21, above 65, or othewise invalid, the invalid event will be logged to the console. To report the error to the user, use {{domxref("HTMLInputElement.reportValidity()")}} instead. +When `false`, if the value is missing, below 21, above 65, or otherwise invalid, the invalid event will be logged to the console. To report the error to the user, use {{domxref("HTMLInputElement.reportValidity()")}} instead. ## Specifications diff --git a/files/en-us/web/api/htmlinputelement/reportvalidity/index.md b/files/en-us/web/api/htmlinputelement/reportvalidity/index.md index 40cbdf0b9c23ec3..0a23a5076414003 100644 --- a/files/en-us/web/api/htmlinputelement/reportvalidity/index.md +++ b/files/en-us/web/api/htmlinputelement/reportvalidity/index.md @@ -72,7 +72,7 @@ reportButton.addEventListener("click", () => { {{EmbedLiveSample("Basic usage", "100%", 120)}} -When `false`, if the value is missing, is below 21, is above 65, or is othewise invalid, an error message appears, an invalid event is fired, and we log that invalid event to the console. +When `false`, if the value is missing, is below 21, is above 65, or is otherwise invalid, an error message appears, an invalid event is fired, and we log that invalid event to the console. ### Custom error message diff --git a/files/en-us/web/api/htmllinkelement/crossorigin/index.md b/files/en-us/web/api/htmllinkelement/crossorigin/index.md index 0367f655679cead..e4a682fba53b0ea 100644 --- a/files/en-us/web/api/htmllinkelement/crossorigin/index.md +++ b/files/en-us/web/api/htmllinkelement/crossorigin/index.md @@ -19,7 +19,7 @@ A string of a keyword specifying the CORS mode to use when fetching the resource - `use-credentials` - : Requests sent by the {{domxref("HTMLLinkElement")}} will use the `cors` {{domxref("Request.mode", "mode", "", "nocode")}} and the `include` {{domxref("Request.credentials", "credentials", "", "nocode")}} mode. All resources requests by the element will use CORS, regardless of what domain the fetch is from. -If the `crossOrigin` property is specified with any other value, it is the same as specifing as the `anonymous`. +If the `crossOrigin` property is specified with any other value, it is the same as specifying as the `anonymous`. If the `crossOrigin` property is not specified, the resource is fetched without CORS (the `no-cors` {{domxref("Request.mode", "mode", "", "nocode")}} and the `same-origin` {{domxref("Request.credentials", "credentials", "", "nocode")}} mode). diff --git a/files/en-us/web/api/htmlmediaelement/crossorigin/index.md b/files/en-us/web/api/htmlmediaelement/crossorigin/index.md index 58ae4e621967e87..091b30d5fb64696 100644 --- a/files/en-us/web/api/htmlmediaelement/crossorigin/index.md +++ b/files/en-us/web/api/htmlmediaelement/crossorigin/index.md @@ -19,7 +19,7 @@ A string of a keyword specifying the CORS mode to use when fetching the resource - `use-credentials` - : Requests sent by the {{domxref("HTMLMediaElement")}} will use the `cors` {{domxref("Request.mode", "mode", "", "nocode")}} and the `include` {{domxref("Request.credentials", "credentials", "", "nocode")}} mode. All resources requests by the element will use CORS, regardless of what domain the fetch is from. -If the `crossOrigin` property is specified with any other value, it is the same as specifing as the `anonymous`. +If the `crossOrigin` property is specified with any other value, it is the same as specifying as the `anonymous`. If the `crossOrigin` property is not specified, the resource is fetched without CORS (the `no-cors` {{domxref("Request.mode", "mode", "", "nocode")}} and the `same-origin` {{domxref("Request.credentials", "credentials", "", "nocode")}} mode). diff --git a/files/en-us/web/api/htmlmeterelement/min/index.md b/files/en-us/web/api/htmlmeterelement/min/index.md index 7313314e46696ad..21873197d203475 100644 --- a/files/en-us/web/api/htmlmeterelement/min/index.md +++ b/files/en-us/web/api/htmlmeterelement/min/index.md @@ -8,7 +8,7 @@ browser-compat: api.HTMLMeterElement.min {{ APIRef("HTML DOM") }} -The **`min`** property of the {{DOMxRef("HTMLMeterElement")}} interface represents the mimimum value of the {{htmlelement("meter")}} element as a floating-point number. It reflects the element's [`min`](/en-US/docs/Web/HTML/Element/meter#min) attribute, or `0` if no `min` is defined. +The **`min`** property of the {{DOMxRef("HTMLMeterElement")}} interface represents the minimum value of the {{htmlelement("meter")}} element as a floating-point number. It reflects the element's [`min`](/en-US/docs/Web/HTML/Element/meter#min) attribute, or `0` if no `min` is defined. This property can also be set directly, for example to set a default value based on some condition. diff --git a/files/en-us/web/api/htmlscriptelement/crossorigin/index.md b/files/en-us/web/api/htmlscriptelement/crossorigin/index.md index bd70c3973e9e977..386cd205cfbc2c7 100644 --- a/files/en-us/web/api/htmlscriptelement/crossorigin/index.md +++ b/files/en-us/web/api/htmlscriptelement/crossorigin/index.md @@ -19,7 +19,7 @@ A string of a keyword specifying the CORS mode to use when fetching the resource - `use-credentials` - : Requests sent by the {{domxref("HTMLScriptElement")}} will use the `cors` {{domxref("Request.mode", "mode", "", "nocode")}} and the `include` {{domxref("Request.credentials", "credentials", "", "nocode")}} mode. All resources requests by the element will use CORS, regardless of which domain the fetch is from. -If the `crossOrigin` property is specified with any other value, it is the same as specifing it as the `anonymous`. +If the `crossOrigin` property is specified with any other value, it is the same as specifying it as the `anonymous`. If the `crossOrigin` property is not specified, the resource is fetched without CORS (the `no-cors` {{domxref("Request.mode", "mode", "", "nocode")}} and the `same-origin` {{domxref("Request.credentials", "credentials", "", "nocode")}} mode). diff --git a/files/en-us/web/api/htmlscriptelement/fetchpriority/index.md b/files/en-us/web/api/htmlscriptelement/fetchpriority/index.md index 51c28b98d4c68c5..cfb544ff311509f 100644 --- a/files/en-us/web/api/htmlscriptelement/fetchpriority/index.md +++ b/files/en-us/web/api/htmlscriptelement/fetchpriority/index.md @@ -24,7 +24,7 @@ A string representing the priority hint. Possible values are: - : Default mode, which indicates no preference for the fetch priority. The browser decides what is best for the user. -If the `fetchpriority` attribute is not specified or is specified with any other value, it is the same as specifing it as `auto`. +If the `fetchpriority` attribute is not specified or is specified with any other value, it is the same as specifying it as `auto`. The `fetchPriority` property allows you to signal high or low priority external script fetches. This can be useful when applied to {{HTMLElement("script")}} elements diff --git a/files/en-us/web/api/identityprovider/index.md b/files/en-us/web/api/identityprovider/index.md index 3d2b01c8cc00a3d..a89ea671df9ebe7 100644 --- a/files/en-us/web/api/identityprovider/index.md +++ b/files/en-us/web/api/identityprovider/index.md @@ -16,7 +16,7 @@ The **`IdentityProvider`** interface of the [Federated Credential Management (Fe ## Static methods - {{domxref("IdentityProvider.close_static", "close()")}} {{experimental_inline}} - - : Provides a manual signal to the browser that an IdP sign-in flow is finished. This is needed to, for example, close the IdP sign-in dialog when sign-in is completely finished and the IdP has finished colecting data from the user. + - : Provides a manual signal to the browser that an IdP sign-in flow is finished. This is needed to, for example, close the IdP sign-in dialog when sign-in is completely finished and the IdP has finished collecting data from the user. - {{domxref("IdentityProvider.getUserInfo_static", "getUserInfo()")}} {{experimental_inline}} - : Returns information about a previously signed in user on their return to an IdP, which can be used to provide a personalized welcome message and sign-in button. diff --git a/files/en-us/web/api/mediakeys/getstatusforpolicy/index.md b/files/en-us/web/api/mediakeys/getstatusforpolicy/index.md index bd19376fd991aaa..aae06cc7ebe6a05 100644 --- a/files/en-us/web/api/mediakeys/getstatusforpolicy/index.md +++ b/files/en-us/web/api/mediakeys/getstatusforpolicy/index.md @@ -142,7 +142,7 @@ async function getMediaStatus(config) { log(mediaStatus); // Get the content or fallback to an alternative if the - // keys are not usuable + // keys are not usable if (mediaStatus === "usable") { console.log("HDCP 2.2 can be enforced."); // Fetch the high resolution protected content diff --git a/files/en-us/web/api/mediakeys/index.md b/files/en-us/web/api/mediakeys/index.md index f67f41988f860d4..912e9829883295b 100644 --- a/files/en-us/web/api/mediakeys/index.md +++ b/files/en-us/web/api/mediakeys/index.md @@ -82,7 +82,7 @@ async function getMediaStatus(config) { log(mediaStatus); // Get the content or fallback to an alternative if the - // keys are not usuable + // keys are not usable if (mediaStatus === "usable") { console.log("HDCP 2.2 can be enforced."); // Fetch the high resolution protected content diff --git a/files/en-us/web/api/mediarecorder/start/index.md b/files/en-us/web/api/mediarecorder/start/index.md index e0bc68f2313c626..4f4877fa8e74fc7 100644 --- a/files/en-us/web/api/mediarecorder/start/index.md +++ b/files/en-us/web/api/mediarecorder/start/index.md @@ -76,7 +76,7 @@ handler to respond to these errors. - : Thrown if: - The media stream you are attempting to record is inactive. - One or more of the stream's tracks is in a format that cannot be recorded using the current configuration - - The `videoKeyFrameIntervalDuration` and `videoKeyFrameIntervalCount` parameter are both specificed when creating the `MediaRecorder`. + - The `videoKeyFrameIntervalDuration` and `videoKeyFrameIntervalCount` parameter are both specified when creating the `MediaRecorder`. - `SecurityError` {{domxref("DOMException")}} - : Thrown if the {{domxref("MediaStream")}} is configured to disallow recording. This may be the case, for example, with sources obtained using {{domxref("MediaDevices.getUserMedia", "getUserMedia()")}} when the user denies permission to use an input device. This diff --git a/files/en-us/web/api/pictureinpicturewindow/width/index.md b/files/en-us/web/api/pictureinpicturewindow/width/index.md index a433eee86cd588e..c5880b11da915a2 100644 --- a/files/en-us/web/api/pictureinpicturewindow/width/index.md +++ b/files/en-us/web/api/pictureinpicturewindow/width/index.md @@ -8,7 +8,7 @@ browser-compat: api.PictureInPictureWindow.width {{APIRef("Picture-in-Picture API")}} -The read-only **`width`** property of the {{domxref("PictureInPictureWindow")}} inbterface returns the width of the floating video window in pixels. +The read-only **`width`** property of the {{domxref("PictureInPictureWindow")}} interface returns the width of the floating video window in pixels. ## Syntax diff --git a/files/en-us/web/api/publickeycredential/tojson/index.md b/files/en-us/web/api/publickeycredential/tojson/index.md index e44e0976df1092a..e68a3bde0e3c554 100644 --- a/files/en-us/web/api/publickeycredential/tojson/index.md +++ b/files/en-us/web/api/publickeycredential/tojson/index.md @@ -43,7 +43,7 @@ The object properties are: - `type` - : The string `"public-key"`. - `clientExtensionResults` - - : An array contaning [base64url](/en-US/docs/Glossary/Base64)-encoded versions of the values returned by {{domxref("PublicKeyCredential.getClientExtensionResults()")}}. + - : An array containing [base64url](/en-US/docs/Glossary/Base64)-encoded versions of the values returned by {{domxref("PublicKeyCredential.getClientExtensionResults()")}}. - `response` - : The response property object depends on whether the credentials are returned following a registration or authentication operation. diff --git a/files/en-us/web/api/rtcencodedaudioframe/index.md b/files/en-us/web/api/rtcencodedaudioframe/index.md index 9e1d7d92adc6b71..4595b5155de1abf 100644 --- a/files/en-us/web/api/rtcencodedaudioframe/index.md +++ b/files/en-us/web/api/rtcencodedaudioframe/index.md @@ -31,7 +31,7 @@ The `data` property gives access to the encoded frame data as a buffer, which mi This code snippet shows a handler for the `rtctransform` event in a {{domxref("Worker")}} that implements a {{domxref("TransformStream")}}, and pipes encoded frames through it from the `event.transformer.readable` to `event.transformer.writable` (`event.transformer` is a {{domxref("RTCRtpScriptTransformer")}}, the worker-side counterpart of {{domxref("RTCRtpScriptTransform")}}). -If the tranformer is inserted into an audio stream, the `transform()` method is called with a `RTCEncodedAudioFrame` whenever a new frame is enqueued on `event.transformer.readable`. +If the transformer is inserted into an audio stream, the `transform()` method is called with a `RTCEncodedAudioFrame` whenever a new frame is enqueued on `event.transformer.readable`. The `transform()` method shows how this might be read, modified using a fictional encryption function, and then enqueued on the controller (this ultimately pipes it through to the `event.transformer.writable`, and then back into the WebRTC pipline). ```js diff --git a/files/en-us/web/api/rtcencodedvideoframe/index.md b/files/en-us/web/api/rtcencodedvideoframe/index.md index 84e6bcfa4da4e84..08e36376a8cf8c8 100644 --- a/files/en-us/web/api/rtcencodedvideoframe/index.md +++ b/files/en-us/web/api/rtcencodedvideoframe/index.md @@ -42,7 +42,7 @@ The {{domxref("RTCEncodedVideoFrame.data", "data")}} property provides access to This code snippet shows a handler for the `rtctransform` event in a {{domxref("Worker")}} that implements a {{domxref("TransformStream")}}, and pipes encoded frames through it from the `event.transformer.readable` to `event.transformer.writable` (`event.transformer` is a {{domxref("RTCRtpScriptTransformer")}}, the worker-side counterpart of {{domxref("RTCRtpScriptTransform")}}). -If the tranformer is inserted into a video stream, the `transform()` method is called with a `RTCEncodedVideoFrame` whenever a new frame is enqueued on `event.transformer.readable`. +If the transformer is inserted into a video stream, the `transform()` method is called with a `RTCEncodedVideoFrame` whenever a new frame is enqueued on `event.transformer.readable`. The `transform()` method shows how this might be read, modified by inverting the bits, and then enqueued on the controller (this ultimately pipes it through to the `event.transformer.writable`, and then back into the WebRTC pipline). ```js diff --git a/files/en-us/web/api/svglengthlist/index.md b/files/en-us/web/api/svglengthlist/index.md index 10024c2c90b16dd..8dc2d33c6d9bfb9 100644 --- a/files/en-us/web/api/svglengthlist/index.md +++ b/files/en-us/web/api/svglengthlist/index.md @@ -41,7 +41,7 @@ An `SVGLengthList` object is indexable and can be accessed like an array. ### Using SVGLengthList -An `SVGLengthList` object can be retrived from an {{domxref("SVGAnimatedLengthList")}} object, which itself is retrievable from many animatable length attributes, such as {{domxref("SVGTextPositioningElement.x")}}. +An `SVGLengthList` object can be retrievd from an {{domxref("SVGAnimatedLengthList")}} object, which itself is retrievable from many animatable length attributes, such as {{domxref("SVGTextPositioningElement.x")}}. #### HTML diff --git a/files/en-us/web/api/view_transitions_api/using/index.md b/files/en-us/web/api/view_transitions_api/using/index.md index 113f447592edb94..7f821f8b2850a19 100644 --- a/files/en-us/web/api/view_transitions_api/using/index.md +++ b/files/en-us/web/api/view_transitions_api/using/index.md @@ -496,7 +496,7 @@ Styles are render blocked by default, and scripts can be render blocked using th To ensure that your initial HTML has been parsed and will always render consistently before the transition animation runs, you can use [``](/en-US/docs/Web/HTML/Attributes/rel#expect). In this element, you include the following attributes: - `rel="expect"` to indicate that you want to use this `` element to render block some HTML on the page. -- `href="#element-id"` to indicate the ID of the elment you want to render block. +- `href="#element-id"` to indicate the ID of the element you want to render block. - `blocking="render"` to render block the specified HTML. Let's explore what this looks like with a simple example HTML document: diff --git a/files/en-us/web/api/wakelock/request/index.md b/files/en-us/web/api/wakelock/request/index.md index 695a7894e962ebd..f0ddc679cadb23e 100644 --- a/files/en-us/web/api/wakelock/request/index.md +++ b/files/en-us/web/api/wakelock/request/index.md @@ -8,7 +8,7 @@ browser-compat: api.WakeLock.request {{APIRef("Screen Wake Lock API")}}{{SecureContext_Header}} -The **`request()`** method of the {{domxref("WakeLock")}} interface returns a {{jsxref("Promise")}} that fullfills with a {{domxref("WakeLockSentinel")}} object if the system screen wake lock is granted. +The **`request()`** method of the {{domxref("WakeLock")}} interface returns a {{jsxref("Promise")}} that fulfills with a {{domxref("WakeLockSentinel")}} object if the system screen wake lock is granted. The screen wake lock prevents device screens from dimming or locking when an application needs to keep running. diff --git a/files/en-us/web/api/webrtc_api/using_encoded_transforms/index.md b/files/en-us/web/api/webrtc_api/using_encoded_transforms/index.md index 719606a42814c18..02703a60a132ed7 100644 --- a/files/en-us/web/api/webrtc_api/using_encoded_transforms/index.md +++ b/files/en-us/web/api/webrtc_api/using_encoded_transforms/index.md @@ -39,7 +39,7 @@ const supportsEncodedTransforms = ## Adding a transform for outgoing frames -A transform running in a worker is inserted into the outgoing WebRTC pipeline by assigning its corresponding `RTCRtpScriptTransform` to the {{domxref("RTCRtpSender.transform")}} for an outgong track. +A transform running in a worker is inserted into the outgoing WebRTC pipeline by assigning its corresponding `RTCRtpScriptTransform` to the {{domxref("RTCRtpSender.transform")}} for an outgoing track. This example shows how you might stream video from a user's webcam over WebRTC, adding a WebRTC encoded transform to modify the outgoing streams. The code assumes that there is an {{domxref("RTCPeerConnection")}} called `peerConnection` that is already connected to a remote peer. @@ -180,7 +180,7 @@ The [`RTCRtpScriptTransform` constructor](/en-US/docs/Web/API/RTCRtpScriptTransf In the previous example we passed static information, but sometimes you might want to modify the transform algorithm in the worker at runtime, or get information back from the worker. For example, a WebRTC conference call that supports encryption might need to add a new key to the algorithm used by the transform. -While it is possible to share information between the worker running the tranform code and the main thread using {{domxref("Worker.postMessage()")}}, it is generally easier to share a {{domxref("MessageChannel")}} as an [`RTCRtpScriptTransform` constructor](/en-US/docs/Web/API/RTCRtpScriptTransform/RTCRtpScriptTransform) option, because then the channel context is directly available in the `event.transformer.options` when you are handling a new encoded frame. +While it is possible to share information between the worker running the transform code and the main thread using {{domxref("Worker.postMessage()")}}, it is generally easier to share a {{domxref("MessageChannel")}} as an [`RTCRtpScriptTransform` constructor](/en-US/docs/Web/API/RTCRtpScriptTransform/RTCRtpScriptTransform) option, because then the channel context is directly available in the `event.transformer.options` when you are handling a new encoded frame. The code below creates a {{domxref("MessageChannel")}} and [transfers](/en-US/docs/Web/API/Web_Workers_API/Transferable_objects) its second port to the worker. The main thread and transform can subsequently communicate using the first and second ports. @@ -228,7 +228,7 @@ Similarly, if an encoded transform was used to encrypt frames, the recipient wou In order to ensure that a new key frame can be sent as early as possible when needed, the {{domxref("RTCRtpScriptTransformer")}} object in `event.transformer` has two methods: {{domxref("RTCRtpScriptTransformer.generateKeyFrame()")}}, which causes the codec to generate a key frame, and {{domxref("RTCRtpScriptTransformer.sendKeyFrameRequest()")}}, which a receiver can use to request a key frame from the sender. The example below shows how the main thread might pass an encryption key to a sender transform, and trigger the codec to generate a key frame. -Note that the main thread doesn't have direct access to the {{domxref("RTCRtpScriptTransformer")}} object, so it needs to pass the key and restriction identifier ("rid") to the worker (the "rid" is a stream id, which indicates the encoder that must generat the key frame). +Note that the main thread doesn't have direct access to the {{domxref("RTCRtpScriptTransformer")}} object, so it needs to pass the key and restriction identifier ("rid") to the worker (the "rid" is a stream id, which indicates the encoder that must generate the key frame). Here we do that with a `MessageChannel`, using the same pattern as in the previous section. The code assumes there is already a peer connection, and that `videoSender` is an {{domxref("RTCRtpSender")}}. diff --git a/files/en-us/web/css/@counter-style/speak-as/index.md b/files/en-us/web/css/@counter-style/speak-as/index.md index 943524939fb0bc3..38cb38d07323bd1 100644 --- a/files/en-us/web/css/@counter-style/speak-as/index.md +++ b/files/en-us/web/css/@counter-style/speak-as/index.md @@ -75,7 +75,7 @@ To experience the result of the `speak-as` descriptor, use assistive technology
  • I ate two bananas
  • I devoured three oranges
  • I am not hungry for dinner
    • -
  • But I'll have five scopps of ice cream for desert
    • +
  • But I'll have five scoops of ice cream for dessert
    • ``` diff --git a/files/en-us/web/css/@import/index.md b/files/en-us/web/css/@import/index.md index efe976db4ec79ee..3428317ddbbfdd1 100644 --- a/files/en-us/web/css/@import/index.md +++ b/files/en-us/web/css/@import/index.md @@ -109,7 +109,7 @@ The `@import` rules in the above examples show media-dependent conditions that w The `@import` rules above illustrate how you might import a layout that uses a grid if `display: grid` is supported, and otherwise imports CSS that uses `display: flex`. While you can only have one `supports()` statement, you can combine any number of feature checks with `not`, `and`, and `or`. However, you must use parenthesis to define precedence when you mix them, e.g. `supports((..) or (..) and not (..))` is invalid, but `supports((..) or ((..) and (not (..))))` is valid. -Note that if you just have a single declaration then you don't need to wrap it in additional parenthese: this is shown in the first example above. +Note that if you just have a single declaration then you don't need to wrap it in additional parentheses: this is shown in the first example above. The examples above show support conditions using simple declaration syntax. You can also specify CSS functions in `supports()`, and it will evaluate to `true` if they are supported and can be evaluated on the user-agent. diff --git a/files/en-us/web/css/content/index.md b/files/en-us/web/css/content/index.md index 20a4ea44f6afb0b..764dbb2593d3e2f 100644 --- a/files/en-us/web/css/content/index.md +++ b/files/en-us/web/css/content/index.md @@ -114,7 +114,7 @@ The keywords and data types mentioned above are described in more detail below: - `` - - : The `` data type inclues a leader function: `leader( )`. This function accepts the keyword values `dotted`, `solid`, or `space` (equal to `leader(".")`, `leader("_")`, and `leader(" ")`, respectively), or a `` as a parameter. When supported and used as a value for `content`, the leader-type provided will be inserted as a repeating pattern, visually connecting content across a horizontal line. + - : The `` data type includes a leader function: `leader( )`. This function accepts the keyword values `dotted`, `solid`, or `space` (equal to `leader(".")`, `leader("_")`, and `leader(" ")`, respectively), or a `` as a parameter. When supported and used as a value for `content`, the leader-type provided will be inserted as a repeating pattern, visually connecting content across a horizontal line. - `attr(x)` diff --git a/files/en-us/web/css/css_colors/color_values/index.md b/files/en-us/web/css/css_colors/color_values/index.md index d46a2ca26616f94..5b007660a29282e 100644 --- a/files/en-us/web/css/css_colors/color_values/index.md +++ b/files/en-us/web/css/css_colors/color_values/index.md @@ -332,7 +332,7 @@ th { ### LCH and OKLCH: CIELAB and Oklab color spaces -While `hsl()` and `hwb()` are intuitive, they have a major drawback. With these functions, every fully-saturated hue angle (`hsl( 100% 50%)` or `hwb( 0% 0%)`) has the same lightess, but that is not how human vision or monitors work. Putting white text on fully saturated blue (`hsl(240deg 100% 50%)`) is legible, but that same text on fully saturated yellow (`hsl(60deg 100% 50%)`) will not only be illegible, but may hurt your user's eyes. In these color functions, the lightness of a color is relative to other colors, not to human perception. In reality, not all hues have the same max saturation. +While `hsl()` and `hwb()` are intuitive, they have a major drawback. With these functions, every fully-saturated hue angle (`hsl( 100% 50%)` or `hwb( 0% 0%)`) has the same lightness, but that is not how human vision or monitors work. Putting white text on fully saturated blue (`hsl(240deg 100% 50%)`) is legible, but that same text on fully saturated yellow (`hsl(60deg 100% 50%)`) will not only be illegible, but may hurt your user's eyes. In these color functions, the lightness of a color is relative to other colors, not to human perception. In reality, not all hues have the same max saturation. Wouldn't it be fantastic if you could simply change the hue channel of a color on a site without making text illegible? You can with color functions in the CIELAB and Oklab color spaces. diff --git a/files/en-us/web/css/css_properties_and_values_api/index.md b/files/en-us/web/css/css_properties_and_values_api/index.md index 2cb6942caa7a52f..2f4333951df6d7f 100644 --- a/files/en-us/web/css/css_properties_and_values_api/index.md +++ b/files/en-us/web/css/css_properties_and_values_api/index.md @@ -59,7 +59,7 @@ CSS.registerProperty({ {{EmbedLiveSample("Properties and values API in action",600,120)}} -The box has a [backround](/en-US/docs/Web/CSS/background) consisting of a [linear gradient](/en-US/docs/Web/CSS/gradient/linear-gradient) from `--stop-color` (the custom property) to [`lavenderblush`](/en-US/docs/Web/CSS/named-color). +The box has a [background](/en-US/docs/Web/CSS/background) consisting of a [linear gradient](/en-US/docs/Web/CSS/gradient/linear-gradient) from `--stop-color` (the custom property) to [`lavenderblush`](/en-US/docs/Web/CSS/named-color). The value of `--stop-color` is set to `cornflowerblue` at first, but when you hover over the box, `--stop-color` [transitions](/en-US/docs/Web/CSS/transition) to `aquamarine` over two seconds (`linear-gradient(to right, aquamarine, lavenderblush)`). ## Reference diff --git a/files/en-us/web/css/css_shapes/overview_of_shapes/index.md b/files/en-us/web/css/css_shapes/overview_of_shapes/index.md index ef37df09214236d..c9e87a967a482e6 100644 --- a/files/en-us/web/css/css_shapes/overview_of_shapes/index.md +++ b/files/en-us/web/css/css_shapes/overview_of_shapes/index.md @@ -96,7 +96,7 @@ In the example below we have added a `shape-margin` to a basic shape. Change the In the examples above, we have used images or a visible element to define the shape, meaning that you can see the shape on the page. Instead, you might want to flow some text along a non-rectangular invisible line. We could, for example, add an empty floated {{htmlelement("div")}} or {{htmlelement("span")}} element to our DOM and make it invisible. However, we can create a shape with only CSS using [generated content](/en-US/docs/Learn/CSS/Howto/Generated_content) and keep all our styling functionality inside the CSS. -In this example, we use generated content to insert an element with a height and width of 150px. We can then use basic Sshapes, box values, or even the alpha channel of an image to create a shape for the text to wrap around. +In this example, we use generated content to insert an element with a height and width of 150px. We can then use basic Shapes, box values, or even the alpha channel of an image to create a shape for the text to wrap around. {{EmbedGHLiveSample("css-examples/shapes/overview/generated-content.html", '100%', 850)}} diff --git a/files/en-us/web/css/marker-mid/index.md b/files/en-us/web/css/marker-mid/index.md index c64da96fa7e5587..23449b48d14f813 100644 --- a/files/en-us/web/css/marker-mid/index.md +++ b/files/en-us/web/css/marker-mid/index.md @@ -9,7 +9,7 @@ browser-compat: css.properties.marker-mid The **`marker-mid`** [CSS](/en-US/docs/Web/CSS) property points to a marker that will be drawn on the middle vertices of the element's path; that is, at each of its vertices between the start and end vertices. The marker must have been defined using an SVG {{SVGElement('marker')}} element, and can only be referenced with a {{cssxref('url()')}} value. The value of the CSS property overrides any values of the `marker-mid` attribute in the SVG. -The direction each marker points is defined as the direction halfway between the direction at the end of the precending path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions. +The direction each marker points is defined as the direction halfway between the direction at the end of the preceding path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions. > [!NOTE] > The `marker-mid` property will only have an effect for elements that can use SVG markers. See {{SVGAttr("marker-mid")}} for a list. diff --git a/files/en-us/web/css/marker/index.md b/files/en-us/web/css/marker/index.md index 9b3f3334716ff29..742aa9492b3d092 100644 --- a/files/en-us/web/css/marker/index.md +++ b/files/en-us/web/css/marker/index.md @@ -11,7 +11,7 @@ The **`marker`** [CSS](/en-US/docs/Web/CSS) property points to a marker that wil For many marker-supporting shapes, the first and last vertices are in the same place: for example, the top left corner of a {{SVGElement('rect')}}. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not point in the same direction. -For the middle vertices, the direction each marker points is defined as the direction halfway between the direction at the end of the precending path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions. +For the middle vertices, the direction each marker points is defined as the direction halfway between the direction at the end of the preceding path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions. > [!NOTE] > The `marker` property will only have an effect for elements that can use SVG markers. See {{SVGAttr("marker-start")}} for a list. diff --git a/files/en-us/web/css/position-anchor/index.md b/files/en-us/web/css/position-anchor/index.md index 52f60b47bc86ad6..1f5d23ff55f4ebf 100644 --- a/files/en-us/web/css/position-anchor/index.md +++ b/files/en-us/web/css/position-anchor/index.md @@ -9,7 +9,7 @@ browser-compat: css.properties.position-anchor {{CSSRef}}{{seecompattable}} -The **`position-anchor`** [CSS](/en-US/docs/Web/CSS) property specifices the anchor name of the **anchor element** (i.e. an element that has an **anchor name** set on it via the {{cssxref("anchor-name")}} property) a positioned element is associated with. +The **`position-anchor`** [CSS](/en-US/docs/Web/CSS) property specifies the anchor name of the **anchor element** (i.e. an element that has an **anchor name** set on it via the {{cssxref("anchor-name")}} property) a positioned element is associated with. ## Syntax diff --git a/files/en-us/web/css/position-area_value/index.md b/files/en-us/web/css/position-area_value/index.md index a52e4209e15ca4d..f0461c359d7b9c4 100644 --- a/files/en-us/web/css/position-area_value/index.md +++ b/files/en-us/web/css/position-area_value/index.md @@ -180,11 +180,11 @@ The generic logical spanning keywords — when combined with a logical row or co - `span-start` - - : Span the center tile and the start tile of the grid row/column, with the direction refering to the writing mode of the element's containing block. + - : Span the center tile and the start tile of the grid row/column, with the direction referring to the writing mode of the element's containing block. - `span-end` - - : Span the center tile and the end tile of the grid row/column, with the direction refering to the writing mode of the element's containing block. + - : Span the center tile and the end tile of the grid row/column, with the direction referring to the writing mode of the element's containing block. - `span-self-start` diff --git a/files/en-us/web/css/stroke-dasharray/index.md b/files/en-us/web/css/stroke-dasharray/index.md index 69d2978fb1722b7..89883d3f315f3d4 100644 --- a/files/en-us/web/css/stroke-dasharray/index.md +++ b/files/en-us/web/css/stroke-dasharray/index.md @@ -48,7 +48,7 @@ The value is a list of comma and/or white space separated ``, `` - {{cssxref("<length>")}} - - : Pixel units are handled the same as SVG units (see ``, above) and font-based lengths such as `em` are calculated with repect to the element's SVG value for the text size; the effects of other length units may depend on the browser. Negative values are invalid. + - : Pixel units are handled the same as SVG units (see ``, above) and font-based lengths such as `em` are calculated with respect to the element's SVG value for the text size; the effects of other length units may depend on the browser. Negative values are invalid. - {{cssxref("<percentage>")}} diff --git a/files/en-us/web/css/stroke-dashoffset/index.md b/files/en-us/web/css/stroke-dashoffset/index.md index bd86354eb0a6e06..57d1660bb826b43 100644 --- a/files/en-us/web/css/stroke-dashoffset/index.md +++ b/files/en-us/web/css/stroke-dashoffset/index.md @@ -38,7 +38,7 @@ stroke-dashoffset: unset; - {{cssxref("<length>")}} - - : Pixel units are handled the same as SVG units (see ``, above) and font-based lengths such as `em` are calculated with repect to the element's SVG value for the text size; the effects of other length units may depend on the browser. The shifting effect for any value is the same as for `` values (see above). + - : Pixel units are handled the same as SVG units (see ``, above) and font-based lengths such as `em` are calculated with respect to the element's SVG value for the text size; the effects of other length units may depend on the browser. The shifting effect for any value is the same as for `` values (see above). - {{cssxref("<percentage>")}} diff --git a/files/en-us/web/css/stroke-width/index.md b/files/en-us/web/css/stroke-width/index.md index f94d4bde38769e2..21cb09d4e2b5784 100644 --- a/files/en-us/web/css/stroke-width/index.md +++ b/files/en-us/web/css/stroke-width/index.md @@ -30,7 +30,7 @@ stroke-width: unset; - {{cssxref("<length>")}} - - : Pixel units are handled the same as SVG units (see ``, above) and font-based lengths such as `em` are calculated with repect to the element's SVG value for the text size; the effects of other length units may depend on the browser. + - : Pixel units are handled the same as SVG units (see ``, above) and font-based lengths such as `em` are calculated with respect to the element's SVG value for the text size; the effects of other length units may depend on the browser. - {{cssxref("<percentage>")}} diff --git a/files/en-us/web/css/zoom/index.md b/files/en-us/web/css/zoom/index.md index 8977b62defd465e..81dbaad82e3fc34 100644 --- a/files/en-us/web/css/zoom/index.md +++ b/files/en-us/web/css/zoom/index.md @@ -221,7 +221,7 @@ html { } ``` -In this final CSS block we are checking to see if the browser supports `zoom` and if so setting the **not supported** message to `diplay: none;`. +In this final CSS block we are checking to see if the browser supports `zoom` and if so setting the **not supported** message to `display: none;`. ```css @supports (zoom: 1) { diff --git a/files/en-us/web/html/attributes/rel/prerender/index.md b/files/en-us/web/html/attributes/rel/prerender/index.md index 3d2ac8ae5f83272..167b6b6a6d9f14a 100644 --- a/files/en-us/web/html/attributes/rel/prerender/index.md +++ b/files/en-us/web/html/attributes/rel/prerender/index.md @@ -12,7 +12,7 @@ browser-compat: html.elements.link.rel.prerender The **`prerender`** keyword for the [`rel`](/en-US/docs/Web/HTML/Element/link#rel) attribute of the {{HTMLElement("link")}} element is a hint to browsers that the user might need the target resource for the next navigation, and therefore the browser can likely improve the user experience by preemptively fetching and processing the resource — for example, by fetching its subresources or performing some rendering in the background offscreen. -This feature is superceded by the [Speculation Rules API](/en-US/docs/Web/API/Speculation_Rules_API). +This feature is superseded by the [Speculation Rules API](/en-US/docs/Web/API/Speculation_Rules_API). ## Specifications diff --git a/files/en-us/web/html/element/datalist/index.md b/files/en-us/web/html/element/datalist/index.md index fda492794fd7f75..c77f9fa86141411 100644 --- a/files/en-us/web/html/element/datalist/index.md +++ b/files/en-us/web/html/element/datalist/index.md @@ -16,7 +16,7 @@ Only certain types of {{HTMLElement("input")}} support this behavior, and it can Each `