From 2a14c0eac061493b1160076a3e72ec8e346d2223 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Fri, 19 Feb 2021 13:56:36 -0500 Subject: [PATCH] remove 'notranslate' (1) (#2497) --- files/en-us/web/css/--_star_/index.html | 8 +- .../css/-moz-context-properties/index.html | 8 +- .../en-us/web/css/-moz-float-edge/index.html | 8 +- .../-moz-force-broken-image-icon/index.html | 6 +- .../en-us/web/css/-moz-image-rect/index.html | 14 +- .../web/css/-moz-image-region/index.html | 6 +- files/en-us/web/css/-moz-orient/index.html | 6 +- .../-moz-outline-radius-bottomleft/index.html | 6 +- .../index.html | 6 +- .../-moz-outline-radius-topleft/index.html | 6 +- .../-moz-outline-radius-topright/index.html | 6 +- .../web/css/-moz-outline-radius/index.html | 8 +- .../en-us/web/css/-moz-user-focus/index.html | 8 +- .../en-us/web/css/-moz-user-input/index.html | 6 +- .../web/css/-webkit-border-before/index.html | 8 +- .../web/css/-webkit-box-reflect/index.html | 4 +- .../web/css/-webkit-line-clamp/index.html | 8 +- .../css/-webkit-mask-attachment/index.html | 6 +- .../web/css/-webkit-mask-box-image/index.html | 8 +- .../web/css/-webkit-mask-composite/index.html | 6 +- .../css/-webkit-mask-position-x/index.html | 6 +- .../css/-webkit-mask-position-y/index.html | 6 +- .../web/css/-webkit-mask-repeat-x/index.html | 8 +- .../web/css/-webkit-mask-repeat-y/index.html | 8 +- .../css/-webkit-overflow-scrolling/index.html | 6 +- .../css/-webkit-print-color-adjust/index.html | 6 +- .../-webkit-tap-highlight-color/index.html | 4 +- .../css/-webkit-text-fill-color/index.html | 8 +- .../web/css/-webkit-text-security/index.html | 8 +- .../css/-webkit-text-stroke-color/index.html | 10 +- .../css/-webkit-text-stroke-width/index.html | 8 +- .../web/css/-webkit-text-stroke/index.html | 8 +- .../web/css/-webkit-touch-callout/index.html | 6 +- files/en-us/web/css/@charset/index.html | 8 +- .../additive-symbols/index.html | 8 +- .../css/@counter-style/fallback/index.html | 8 +- files/en-us/web/css/@counter-style/index.html | 10 +- .../css/@counter-style/negative/index.html | 8 +- .../web/css/@counter-style/pad/index.html | 8 +- .../web/css/@counter-style/prefix/index.html | 8 +- .../web/css/@counter-style/range/index.html | 8 +- .../css/@counter-style/speak-as/index.html | 8 +- .../web/css/@counter-style/suffix/index.html | 8 +- .../web/css/@counter-style/symbols/index.html | 8 +- .../web/css/@counter-style/system/index.html | 38 +- files/en-us/web/css/@document/index.html | 6 +- .../css/@font-face/font-display/index.html | 6 +- .../web/css/@font-face/font-family/index.html | 6 +- .../css/@font-face/font-stretch/index.html | 6 +- .../web/css/@font-face/font-style/index.html | 8 +- .../css/@font-face/font-variant/index.html | 6 +- .../font-variation-settings/index.html | 6 +- .../web/css/@font-face/font-weight/index.html | 6 +- files/en-us/web/css/@font-face/index.html | 12 +- files/en-us/web/css/@font-face/src/index.html | 6 +- .../css/@font-face/unicode-range/index.html | 8 +- .../web/css/@font-feature-values/index.html | 4 +- files/en-us/web/css/@import/index.html | 8 +- files/en-us/web/css/@keyframes/index.html | 10 +- .../@media/-moz-device-pixel-ratio/index.html | 2 +- .../css/@media/-ms-high-contrast/index.html | 6 +- .../css/@media/-webkit-animation/index.html | 2 +- .../-webkit-device-pixel-ratio/index.html | 6 +- .../@media/-webkit-transform-2d/index.html | 4 +- .../@media/-webkit-transform-3d/index.html | 2 +- .../css/@media/-webkit-transition/index.html | 6 +- .../en-us/web/css/@media/any-hover/index.html | 4 +- .../web/css/@media/any-pointer/index.html | 4 +- .../web/css/@media/aspect-ratio/index.html | 10 +- files/en-us/web/css/@media/aural/index.html | 4 +- .../web/css/@media/color-gamut/index.html | 4 +- .../web/css/@media/color-index/index.html | 6 +- files/en-us/web/css/@media/color/index.html | 4 +- .../css/@media/device-aspect-ratio/index.html | 2 +- .../web/css/@media/device-height/index.html | 2 +- .../web/css/@media/device-width/index.html | 2 +- .../web/css/@media/display-mode/index.html | 2 +- .../web/css/@media/forced-colors/index.html | 4 +- files/en-us/web/css/@media/grid/index.html | 4 +- files/en-us/web/css/@media/height/index.html | 4 +- files/en-us/web/css/@media/hover/index.html | 4 +- files/en-us/web/css/@media/index.html | 8 +- .../web/css/@media/inverted-colors/index.html | 4 +- .../web/css/@media/monochrome/index.html | 4 +- .../web/css/@media/orientation/index.html | 4 +- .../web/css/@media/overflow-block/index.html | 4 +- .../web/css/@media/overflow-inline/index.html | 4 +- files/en-us/web/css/@media/pointer/index.html | 4 +- .../@media/prefers-color-scheme/index.html | 4 +- .../css/@media/prefers-contrast/index.html | 4 +- .../@media/prefers-reduced-data/index.html | 4 +- .../@media/prefers-reduced-motion/index.html | 6 +- .../prefers-reduced-transparency/index.html | 4 +- .../web/css/@media/resolution/index.html | 4 +- files/en-us/web/css/@media/scan/index.html | 4 +- .../en-us/web/css/@media/scripting/index.html | 4 +- files/en-us/web/css/@media/shape/index.html | 6 +- .../css/@media/update-frequency/index.html | 4 +- files/en-us/web/css/@media/width/index.html | 4 +- files/en-us/web/css/@namespace/index.html | 6 +- files/en-us/web/css/@page/bleed/index.html | 6 +- files/en-us/web/css/@page/index.html | 4 +- files/en-us/web/css/@page/marks/index.html | 6 +- files/en-us/web/css/@page/size/index.html | 8 +- files/en-us/web/css/@property/index.html | 8 +- files/en-us/web/css/@supports/index.html | 32 +- files/en-us/web/css/@viewport/index.html | 6 +- .../web/css/_colon_-moz-broken/index.html | 6 +- .../web/css/_colon_-moz-drag-over/index.html | 6 +- .../web/css/_colon_-moz-first-node/index.html | 6 +- .../web/css/_colon_-moz-focusring/index.html | 6 +- .../_colon_-moz-handler-blocked/index.html | 2 +- .../_colon_-moz-handler-crashed/index.html | 2 +- .../_colon_-moz-handler-disabled/index.html | 2 +- .../web/css/_colon_-moz-last-node/index.html | 6 +- .../css/_colon_-moz-list-bullet/index.html | 6 +- .../css/_colon_-moz-list-number/index.html | 6 +- .../web/css/_colon_-moz-loading/index.html | 4 +- .../_colon_-moz-locale-dir(ltr)/index.html | 6 +- .../_colon_-moz-locale-dir(rtl)/index.html | 6 +- .../_colon_-moz-only-whitespace/index.html | 6 +- .../css/_colon_-moz-submit-invalid/index.html | 2 +- .../web/css/_colon_-moz-suppressed/index.html | 4 +- .../web/css/_colon_-moz-ui-valid/index.html | 2 +- .../css/_colon_-moz-user-disabled/index.html | 4 +- .../_colon_-moz-window-inactive/index.html | 6 +- files/en-us/web/css/_colon_active/index.html | 12 +- .../en-us/web/css/_colon_any-link/index.html | 8 +- files/en-us/web/css/_colon_blank/index.html | 6 +- files/en-us/web/css/_colon_checked/index.html | 12 +- files/en-us/web/css/_colon_current/index.html | 10 +- files/en-us/web/css/_colon_default/index.html | 6 +- files/en-us/web/css/_colon_defined/index.html | 12 +- files/en-us/web/css/_colon_dir/index.html | 8 +- .../en-us/web/css/_colon_disabled/index.html | 10 +- files/en-us/web/css/_colon_empty/index.html | 10 +- files/en-us/web/css/_colon_enabled/index.html | 8 +- .../web/css/_colon_first-child/index.html | 12 +- .../web/css/_colon_first-of-type/index.html | 12 +- files/en-us/web/css/_colon_first/index.html | 10 +- .../web/css/_colon_focus-visible/index.html | 10 +- .../web/css/_colon_focus-within/index.html | 8 +- files/en-us/web/css/_colon_focus/index.html | 8 +- .../web/css/_colon_fullscreen/index.html | 8 +- files/en-us/web/css/_colon_future/index.html | 10 +- files/en-us/web/css/_colon_has/index.html | 8 +- files/en-us/web/css/_colon_host()/index.html | 8 +- .../web/css/_colon_host-context()/index.html | 8 +- files/en-us/web/css/_colon_host/index.html | 8 +- files/en-us/web/css/_colon_hover/index.html | 8 +- .../en-us/web/css/_colon_in-range/index.html | 8 +- .../web/css/_colon_indeterminate/index.html | 14 +- files/en-us/web/css/_colon_invalid/index.html | 8 +- files/en-us/web/css/_colon_is/index.html | 24 +- files/en-us/web/css/_colon_lang/index.html | 8 +- .../web/css/_colon_last-child/index.html | 12 +- .../web/css/_colon_last-of-type/index.html | 12 +- files/en-us/web/css/_colon_left/index.html | 6 +- files/en-us/web/css/_colon_link/index.html | 8 +- .../web/css/_colon_local-link/index.html | 8 +- files/en-us/web/css/_colon_not/index.html | 8 +- .../en-us/web/css/_colon_nth-child/index.html | 8 +- files/en-us/web/css/_colon_nth-col/index.html | 8 +- .../web/css/_colon_nth-last-child/index.html | 12 +- .../web/css/_colon_nth-last-col/index.html | 8 +- .../css/_colon_nth-last-of-type/index.html | 8 +- .../web/css/_colon_nth-of-type/index.html | 8 +- .../web/css/_colon_only-child/index.html | 12 +- .../web/css/_colon_only-of-type/index.html | 8 +- .../en-us/web/css/_colon_optional/index.html | 8 +- .../web/css/_colon_out-of-range/index.html | 8 +- files/en-us/web/css/_colon_past/index.html | 10 +- files/en-us/web/css/_colon_paused/index.html | 6 +- .../css/_colon_picture-in-picture/index.html | 6 +- .../css/_colon_placeholder-shown/index.html | 16 +- files/en-us/web/css/_colon_playing/index.html | 6 +- .../en-us/web/css/_colon_read-only/index.html | 10 +- .../web/css/_colon_read-write/index.html | 10 +- .../en-us/web/css/_colon_required/index.html | 8 +- files/en-us/web/css/_colon_right/index.html | 6 +- files/en-us/web/css/_colon_root/index.html | 6 +- files/en-us/web/css/_colon_scope/index.html | 12 +- files/en-us/web/css/_colon_state/index.html | 6 +- .../web/css/_colon_target-within/index.html | 8 +- .../web/css/_colon_user-invalid/index.html | 2 +- files/en-us/web/css/_colon_valid/index.html | 8 +- files/en-us/web/css/_colon_visited/index.html | 8 +- files/en-us/web/css/_colon_where/index.html | 14 +- .../_doublecolon_-moz-color-swatch/index.html | 6 +- .../_doublecolon_-moz-focus-inner/index.html | 6 +- .../index.html | 2 +- .../web/css/_doublecolon_-moz-page/index.html | 2 +- .../_doublecolon_-moz-progress-bar/index.html | 6 +- .../index.html | 6 +- .../_doublecolon_-moz-range-thumb/index.html | 6 +- .../_doublecolon_-moz-range-track/index.html | 6 +- .../index.html | 2 +- .../index.html | 6 +- .../_doublecolon_-webkit-meter-bar/index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../index.html | 6 +- .../_doublecolon_-webkit-scrollbar/index.html | 6 +- .../index.html | 2 +- .../index.html | 2 +- .../index.html | 2 +- .../index.html | 2 +- .../web/css/_doublecolon_after/index.html | 16 +- .../web/css/_doublecolon_backdrop/index.html | 6 +- .../web/css/_doublecolon_before/index.html | 22 +- .../css/_doublecolon_cue-region/index.html | 4 +- .../en-us/web/css/_doublecolon_cue/index.html | 6 +- .../index.html | 14 +- .../css/_doublecolon_first-letter/index.html | 12 +- .../css/_doublecolon_first-line/index.html | 8 +- .../css/_doublecolon_grammar-error/index.html | 6 +- .../web/css/_doublecolon_marker/index.html | 8 +- .../web/css/_doublecolon_part/index.html | 10 +- .../css/_doublecolon_placeholder/index.html | 14 +- .../web/css/_doublecolon_selection/index.html | 10 +- .../web/css/_doublecolon_slotted/index.html | 10 +- .../_doublecolon_spelling-error/index.html | 6 +- .../css/_doublecolon_target-text/index.html | 2 +- .../adjacent_sibling_combinator/index.html | 8 +- files/en-us/web/css/align-content/index.html | 10 +- files/en-us/web/css/align-items/index.html | 10 +- files/en-us/web/css/align-self/index.html | 8 +- files/en-us/web/css/align-tracks/index.html | 4 +- files/en-us/web/css/all/index.html | 24 +- files/en-us/web/css/alpha-value/index.html | 4 +- .../css/alternative_style_sheets/index.html | 2 +- .../en-us/web/css/animation-delay/index.html | 8 +- .../web/css/animation-direction/index.html | 8 +- .../web/css/animation-duration/index.html | 8 +- .../web/css/animation-fill-mode/index.html | 8 +- .../css/animation-iteration-count/index.html | 8 +- files/en-us/web/css/animation-name/index.html | 8 +- .../web/css/animation-play-state/index.html | 8 +- .../css/animation-timing-function/index.html | 16 +- files/en-us/web/css/animation/index.html | 14 +- files/en-us/web/css/appearance/index.html | 362 +++++++++--------- files/en-us/web/css/aspect-ratio/index.html | 8 +- files/en-us/web/css/at-rule/index.html | 4 +- files/en-us/web/css/attr()/index.html | 14 +- .../web/css/attribute_selectors/index.html | 14 +- .../en-us/web/css/backdrop-filter/index.html | 8 +- .../web/css/backface-visibility/index.html | 8 +- .../web/css/background-attachment/index.html | 12 +- .../web/css/background-blend-mode/index.html | 12 +- .../en-us/web/css/background-clip/index.html | 8 +- .../en-us/web/css/background-color/index.html | 8 +- .../en-us/web/css/background-image/index.html | 8 +- .../web/css/background-origin/index.html | 10 +- .../web/css/background-position-x/index.html | 8 +- .../web/css/background-position-y/index.html | 8 +- .../web/css/background-position/index.html | 8 +- .../web/css/background-repeat/index.html | 8 +- .../en-us/web/css/background-size/index.html | 10 +- files/en-us/web/css/background/index.html | 8 +- files/en-us/web/css/basic-shape/index.html | 16 +- files/en-us/web/css/blend-mode/index.html | 70 ++-- files/en-us/web/css/block-size/index.html | 8 +- .../web/css/border-block-color/index.html | 8 +- .../web/css/border-block-end-color/index.html | 8 +- .../web/css/border-block-end-style/index.html | 8 +- .../web/css/border-block-end-width/index.html | 8 +- .../en-us/web/css/border-block-end/index.html | 8 +- .../css/border-block-start-color/index.html | 8 +- .../css/border-block-start-style/index.html | 8 +- .../css/border-block-start-width/index.html | 8 +- .../web/css/border-block-start/index.html | 8 +- .../web/css/border-block-style/index.html | 8 +- .../web/css/border-block-width/index.html | 8 +- files/en-us/web/css/border-block/index.html | 8 +- .../web/css/border-bottom-color/index.html | 8 +- .../css/border-bottom-left-radius/index.html | 14 +- .../css/border-bottom-right-radius/index.html | 14 +- .../web/css/border-bottom-style/index.html | 8 +- .../web/css/border-bottom-width/index.html | 8 +- files/en-us/web/css/border-bottom/index.html | 12 +- .../en-us/web/css/border-collapse/index.html | 8 +- files/en-us/web/css/border-color/index.html | 8 +- .../web/css/border-end-end-radius/index.html | 8 +- .../css/border-end-start-radius/index.html | 8 +- .../web/css/border-image-outset/index.html | 8 +- .../web/css/border-image-repeat/index.html | 10 +- .../web/css/border-image-slice/index.html | 12 +- .../web/css/border-image-source/index.html | 6 +- .../web/css/border-image-width/index.html | 8 +- files/en-us/web/css/border-image/index.html | 12 +- .../web/css/border-inline-color/index.html | 8 +- .../css/border-inline-end-color/index.html | 8 +- .../css/border-inline-end-style/index.html | 8 +- .../css/border-inline-end-width/index.html | 8 +- .../web/css/border-inline-end/index.html | 8 +- .../css/border-inline-start-color/index.html | 8 +- .../css/border-inline-start-style/index.html | 8 +- .../css/border-inline-start-width/index.html | 8 +- .../web/css/border-inline-start/index.html | 8 +- .../web/css/border-inline-style/index.html | 8 +- .../web/css/border-inline-width/index.html | 8 +- files/en-us/web/css/border-inline/index.html | 8 +- .../web/css/border-left-color/index.html | 8 +- .../web/css/border-left-style/index.html | 8 +- .../web/css/border-left-width/index.html | 8 +- files/en-us/web/css/border-left/index.html | 12 +- files/en-us/web/css/border-radius/index.html | 8 +- .../web/css/border-right-color/index.html | 8 +- .../web/css/border-right-style/index.html | 8 +- .../web/css/border-right-width/index.html | 8 +- files/en-us/web/css/border-right/index.html | 12 +- files/en-us/web/css/border-spacing/index.html | 8 +- .../css/border-start-end-radius/index.html | 8 +- .../css/border-start-start-radius/index.html | 8 +- files/en-us/web/css/border-style/index.html | 8 +- .../en-us/web/css/border-top-color/index.html | 8 +- .../web/css/border-top-left-radius/index.html | 14 +- .../css/border-top-right-radius/index.html | 14 +- .../en-us/web/css/border-top-style/index.html | 8 +- .../en-us/web/css/border-top-width/index.html | 8 +- files/en-us/web/css/border-top/index.html | 12 +- files/en-us/web/css/border-width/index.html | 8 +- files/en-us/web/css/border/index.html | 8 +- files/en-us/web/css/bottom/index.html | 8 +- files/en-us/web/css/box-align/index.html | 6 +- .../web/css/box-decoration-break/index.html | 8 +- files/en-us/web/css/box-direction/index.html | 6 +- files/en-us/web/css/box-flex-group/index.html | 6 +- files/en-us/web/css/box-flex/index.html | 6 +- files/en-us/web/css/box-lines/index.html | 6 +- .../web/css/box-ordinal-group/index.html | 6 +- files/en-us/web/css/box-orient/index.html | 8 +- files/en-us/web/css/box-pack/index.html | 8 +- files/en-us/web/css/box-shadow/index.html | 12 +- files/en-us/web/css/box-sizing/index.html | 6 +- files/en-us/web/css/break-after/index.html | 8 +- files/en-us/web/css/break-before/index.html | 8 +- files/en-us/web/css/break-inside/index.html | 8 +- files/en-us/web/css/calc()/index.html | 18 +- files/en-us/web/css/caption-side/index.html | 8 +- files/en-us/web/css/caret-color/index.html | 8 +- files/en-us/web/css/cascade/index.html | 18 +- .../en-us/web/css/child_combinator/index.html | 8 +- files/en-us/web/css/clamp()/index.html | 6 +- .../en-us/web/css/class_selectors/index.html | 10 +- files/en-us/web/css/clear/index.html | 18 +- files/en-us/web/css/clip-path/index.html | 14 +- files/en-us/web/css/clip/index.html | 8 +- files/en-us/web/css/color-adjust/index.html | 8 +- files/en-us/web/css/color-scheme/index.html | 6 +- files/en-us/web/css/color/index.html | 6 +- files/en-us/web/css/color_value/index.html | 16 +- files/en-us/web/css/column-count/index.html | 8 +- files/en-us/web/css/column-fill/index.html | 8 +- files/en-us/web/css/column-gap/index.html | 16 +- .../web/css/column-rule-color/index.html | 8 +- .../web/css/column-rule-style/index.html | 8 +- .../web/css/column-rule-width/index.html | 8 +- files/en-us/web/css/column-rule/index.html | 10 +- files/en-us/web/css/column-span/index.html | 8 +- files/en-us/web/css/column-width/index.html | 8 +- .../web/css/column_combinator/index.html | 8 +- files/en-us/web/css/columns/index.html | 8 +- files/en-us/web/css/comments/index.html | 4 +- .../en-us/web/css/conic-gradient()/index.html | 36 +- .../web/css/contain-intrinsic-size/index.html | 2 +- files/en-us/web/css/contain/index.html | 16 +- .../en-us/web/css/containing_block/index.html | 22 +- .../web/css/content-visibility/index.html | 6 +- files/en-us/web/css/content/index.html | 24 +- files/en-us/web/css/counter()/index.html | 12 +- .../web/css/counter-increment/index.html | 6 +- files/en-us/web/css/counter-reset/index.html | 6 +- files/en-us/web/css/counter-set/index.html | 6 +- files/en-us/web/css/counters()/index.html | 12 +- files/en-us/web/css/cross-fade()/index.html | 16 +- .../using_css_animations/index.html | 40 +- .../resizing_background_images/index.html | 16 +- .../index.html | 8 +- .../index.html | 2 +- .../using_multi-column_layouts/index.html | 24 +- .../using_feature_queries/index.html | 8 +- .../en-us/web/css/css_containment/index.html | 14 +- .../index.html | 2 +- files/en-us/web/css/css_fonts/index.html | 4 +- .../css_fonts/opentype_fonts_guide/index.html | 10 +- .../css_fonts/variable_fonts_guide/index.html | 24 +- files/en-us/web/css/css_functions/index.html | 2 +- .../index.html | 60 +-- .../basic_concepts_of_grid_layout/index.html | 74 ++-- .../index.html | 54 +-- .../index.html | 26 +- .../index.html | 6 +- .../index.html | 42 +- .../grid_template_areas/index.html | 46 +-- .../en-us/web/css/css_grid_layout/index.html | 6 +- .../layout_using_named_grid_lines/index.html | 50 +-- .../index.html | 64 ++-- .../css_grid_layout/masonry_layout/index.html | 2 +- .../index.html | 46 +-- .../relationship_of_grid_layout/index.html | 60 +-- .../index.html | 6 +- .../css_images/using_css_gradients/index.html | 174 ++++----- .../using_css_counters/index.html | 8 +- .../en-us/web/css/css_motion_path/index.html | 4 +- .../adding_z-index/index.html | 4 +- .../stacking_and_float/index.html | 4 +- .../stacking_context_example_1/index.html | 4 +- .../stacking_context_example_2/index.html | 2 +- .../stacking_context_example_3/index.html | 2 +- .../stacking_without_z-index/index.html | 4 +- .../the_stacking_context/index.html | 4 +- files/en-us/web/css/css_scrollbars/index.html | 4 +- .../web/css/css_text_decoration/index.html | 4 +- .../using_css_transforms/index.html | 4 +- .../using_css_transitions/index.html | 102 ++--- .../web/css/css_values_and_units/index.html | 14 +- files/en-us/web/css/cursor/index.html | 8 +- files/en-us/web/css/custom-ident/index.html | 4 +- .../web/css/descendant_combinator/index.html | 8 +- files/en-us/web/css/dimension/index.html | 4 +- files/en-us/web/css/direction/index.html | 6 +- files/en-us/web/css/display-box/index.html | 8 +- files/en-us/web/css/display-inside/index.html | 4 +- .../en-us/web/css/display-internal/index.html | 4 +- files/en-us/web/css/display-legacy/index.html | 6 +- .../en-us/web/css/display-listitem/index.html | 4 +- .../en-us/web/css/display-outside/index.html | 4 +- files/en-us/web/css/display/index.html | 16 +- .../two-value_syntax_of_display/index.html | 2 +- .../en-us/web/css/easing-function/index.html | 18 +- files/en-us/web/css/element()/index.html | 6 +- files/en-us/web/css/empty-cells/index.html | 8 +- files/en-us/web/css/env()/index.html | 14 +- .../web/css/filter-function/blur()/index.html | 4 +- .../filter-function/brightness()/index.html | 4 +- .../css/filter-function/contrast()/index.html | 4 +- .../filter-function/drop-shadow()/index.html | 6 +- .../filter-function/grayscale()/index.html | 4 +- .../filter-function/hue-rotate()/index.html | 4 +- .../en-us/web/css/filter-function/index.html | 6 +- .../css/filter-function/invert()/index.html | 4 +- .../css/filter-function/opacity()/index.html | 4 +- .../css/filter-function/saturate()/index.html | 4 +- .../css/filter-function/sepia()/index.html | 4 +- files/en-us/web/css/filter/index.html | 90 ++--- files/en-us/web/css/fit-content()/index.html | 6 +- files/en-us/web/css/fit-content/index.html | 6 +- files/en-us/web/css/flex-basis/index.html | 8 +- files/en-us/web/css/flex-direction/index.html | 8 +- files/en-us/web/css/flex-flow/index.html | 6 +- files/en-us/web/css/flex-grow/index.html | 8 +- files/en-us/web/css/flex-shrink/index.html | 8 +- files/en-us/web/css/flex-wrap/index.html | 8 +- files/en-us/web/css/flex/index.html | 16 +- files/en-us/web/css/flex_value/index.html | 4 +- files/en-us/web/css/float/index.html | 8 +- files/en-us/web/css/font-family/index.html | 14 +- .../web/css/font-feature-settings/index.html | 6 +- files/en-us/web/css/font-kerning/index.html | 8 +- .../web/css/font-language-override/index.html | 8 +- .../web/css/font-optical-sizing/index.html | 8 +- .../en-us/web/css/font-size-adjust/index.html | 10 +- files/en-us/web/css/font-size/index.html | 20 +- files/en-us/web/css/font-smooth/index.html | 8 +- files/en-us/web/css/font-stretch/index.html | 8 +- files/en-us/web/css/font-style/index.html | 16 +- files/en-us/web/css/font-synthesis/index.html | 6 +- .../css/font-variant-alternates/index.html | 8 +- .../web/css/font-variant-caps/index.html | 8 +- .../css/font-variant-east-asian/index.html | 8 +- .../web/css/font-variant-ligatures/index.html | 8 +- .../web/css/font-variant-numeric/index.html | 4 +- .../web/css/font-variant-position/index.html | 8 +- files/en-us/web/css/font-variant/index.html | 8 +- .../css/font-variation-settings/index.html | 4 +- files/en-us/web/css/font-weight/index.html | 16 +- files/en-us/web/css/font/index.html | 10 +- .../web/css/forced-color-adjust/index.html | 8 +- .../web/css/frequency-percentage/index.html | 8 +- files/en-us/web/css/frequency/index.html | 4 +- files/en-us/web/css/gap/index.html | 16 +- .../css/general_sibling_combinator/index.html | 8 +- files/en-us/web/css/gradient/index.html | 24 +- files/en-us/web/css/grid-area/index.html | 8 +- .../web/css/grid-auto-columns/index.html | 8 +- files/en-us/web/css/grid-auto-flow/index.html | 10 +- files/en-us/web/css/grid-auto-rows/index.html | 8 +- .../en-us/web/css/grid-column-end/index.html | 10 +- .../web/css/grid-column-start/index.html | 10 +- files/en-us/web/css/grid-column/index.html | 6 +- files/en-us/web/css/grid-row-end/index.html | 10 +- files/en-us/web/css/grid-row-start/index.html | 10 +- files/en-us/web/css/grid-row/index.html | 8 +- .../web/css/grid-template-areas/index.html | 8 +- .../web/css/grid-template-columns/index.html | 8 +- .../web/css/grid-template-rows/index.html | 8 +- files/en-us/web/css/grid-template/index.html | 8 +- files/en-us/web/css/grid/index.html | 8 +- .../web/css/hanging-punctuation/index.html | 8 +- files/en-us/web/css/height/index.html | 8 +- files/en-us/web/css/hyphens/index.html | 8 +- files/en-us/web/css/id_selectors/index.html | 10 +- files/en-us/web/css/ident/index.html | 4 +- files/en-us/web/css/image()/index.html | 22 +- .../web/css/image-orientation/index.html | 10 +- .../en-us/web/css/image-rendering/index.html | 10 +- .../en-us/web/css/image-resolution/index.html | 8 +- files/en-us/web/css/image-set()/index.html | 4 +- files/en-us/web/css/image/index.html | 4 +- files/en-us/web/css/ime-mode/index.html | 8 +- files/en-us/web/css/inherit/index.html | 4 +- files/en-us/web/css/inheritance/index.html | 10 +- .../web/css/initial-letter-align/index.html | 8 +- files/en-us/web/css/initial-letter/index.html | 8 +- files/en-us/web/css/initial/index.html | 4 +- files/en-us/web/css/inline-size/index.html | 8 +- .../en-us/web/css/inset-block-end/index.html | 8 +- .../web/css/inset-block-start/index.html | 8 +- files/en-us/web/css/inset-block/index.html | 8 +- .../en-us/web/css/inset-inline-end/index.html | 8 +- .../web/css/inset-inline-start/index.html | 8 +- files/en-us/web/css/inset-inline/index.html | 8 +- files/en-us/web/css/inset/index.html | 8 +- files/en-us/web/css/integer/index.html | 4 +- files/en-us/web/css/isolation/index.html | 8 +- .../en-us/web/css/justify-content/index.html | 10 +- files/en-us/web/css/justify-items/index.html | 8 +- files/en-us/web/css/justify-self/index.html | 8 +- files/en-us/web/css/justify-tracks/index.html | 4 +- .../breadcrumb_navigation/index.html | 2 +- .../web/css/layout_cookbook/card/index.html | 2 +- .../css/layout_cookbook/pagination/index.html | 2 +- files/en-us/web/css/left/index.html | 8 +- .../web/css/length-percentage/index.html | 6 +- files/en-us/web/css/length/index.html | 6 +- files/en-us/web/css/letter-spacing/index.html | 8 +- files/en-us/web/css/line-break/index.html | 8 +- .../en-us/web/css/line-height-step/index.html | 6 +- files/en-us/web/css/line-height/index.html | 10 +- .../web/css/linear-gradient()/index.html | 22 +- .../en-us/web/css/list-style-image/index.html | 4 +- .../web/css/list-style-position/index.html | 8 +- .../en-us/web/css/list-style-type/index.html | 10 +- files/en-us/web/css/list-style/index.html | 10 +- .../en-us/web/css/margin-block-end/index.html | 8 +- .../web/css/margin-block-start/index.html | 8 +- files/en-us/web/css/margin-block/index.html | 8 +- files/en-us/web/css/margin-bottom/index.html | 10 +- .../web/css/margin-inline-end/index.html | 8 +- .../web/css/margin-inline-start/index.html | 8 +- files/en-us/web/css/margin-inline/index.html | 8 +- files/en-us/web/css/margin-left/index.html | 6 +- files/en-us/web/css/margin-right/index.html | 6 +- files/en-us/web/css/margin-top/index.html | 6 +- files/en-us/web/css/margin-trim/index.html | 8 +- files/en-us/web/css/margin/index.html | 10 +- .../en-us/web/css/mask-border-mode/index.html | 6 +- .../web/css/mask-border-outset/index.html | 8 +- .../web/css/mask-border-repeat/index.html | 8 +- .../web/css/mask-border-slice/index.html | 8 +- .../web/css/mask-border-source/index.html | 8 +- .../web/css/mask-border-width/index.html | 8 +- files/en-us/web/css/mask-border/index.html | 8 +- files/en-us/web/css/mask-clip/index.html | 4 +- files/en-us/web/css/mask-composite/index.html | 10 +- files/en-us/web/css/mask-image/index.html | 4 +- files/en-us/web/css/mask-mode/index.html | 4 +- files/en-us/web/css/mask-origin/index.html | 10 +- files/en-us/web/css/mask-position/index.html | 10 +- files/en-us/web/css/mask-repeat/index.html | 12 +- files/en-us/web/css/mask-size/index.html | 10 +- files/en-us/web/css/mask-type/index.html | 12 +- files/en-us/web/css/mask/index.html | 6 +- .../web/css/masonry-auto-flow/index.html | 10 +- files/en-us/web/css/math-style/index.html | 6 +- files/en-us/web/css/max()/index.html | 8 +- files/en-us/web/css/max-block-size/index.html | 8 +- files/en-us/web/css/max-content/index.html | 10 +- files/en-us/web/css/max-height/index.html | 6 +- .../en-us/web/css/max-inline-size/index.html | 8 +- files/en-us/web/css/max-width/index.html | 8 +- .../using_media_queries/index.html | 42 +- .../index.html | 6 +- files/en-us/web/css/min()/index.html | 6 +- files/en-us/web/css/min-block-size/index.html | 8 +- files/en-us/web/css/min-content/index.html | 10 +- files/en-us/web/css/min-height/index.html | 6 +- .../en-us/web/css/min-inline-size/index.html | 8 +- files/en-us/web/css/min-width/index.html | 6 +- files/en-us/web/css/minmax()/index.html | 8 +- files/en-us/web/css/mix-blend-mode/index.html | 16 +- files/en-us/web/css/number/index.html | 4 +- files/en-us/web/css/object-fit/index.html | 6 +- .../en-us/web/css/object-position/index.html | 8 +- files/en-us/web/css/offset-anchor/index.html | 8 +- .../en-us/web/css/offset-distance/index.html | 8 +- files/en-us/web/css/offset-path/index.html | 8 +- .../en-us/web/css/offset-position/index.html | 8 +- files/en-us/web/css/offset-rotate/index.html | 8 +- files/en-us/web/css/offset/index.html | 8 +- files/en-us/web/css/opacity/index.html | 12 +- files/en-us/web/css/order/index.html | 8 +- files/en-us/web/css/orphans/index.html | 8 +- files/en-us/web/css/outline-color/index.html | 8 +- files/en-us/web/css/outline-offset/index.html | 8 +- files/en-us/web/css/outline-style/index.html | 24 +- files/en-us/web/css/outline-width/index.html | 8 +- files/en-us/web/css/outline/index.html | 8 +- .../guide_to_scroll_anchoring/index.html | 4 +- .../en-us/web/css/overflow-anchor/index.html | 6 +- files/en-us/web/css/overflow-block/index.html | 8 +- .../en-us/web/css/overflow-inline/index.html | 8 +- files/en-us/web/css/overflow-wrap/index.html | 8 +- files/en-us/web/css/overflow-x/index.html | 8 +- files/en-us/web/css/overflow-y/index.html | 8 +- files/en-us/web/css/overflow/index.html | 12 +- .../css/overscroll-behavior-block/index.html | 8 +- .../css/overscroll-behavior-inline/index.html | 8 +- .../web/css/overscroll-behavior-x/index.html | 6 +- .../web/css/overscroll-behavior-y/index.html | 6 +- .../web/css/overscroll-behavior/index.html | 8 +- .../web/css/padding-block-end/index.html | 8 +- .../web/css/padding-block-start/index.html | 8 +- files/en-us/web/css/padding-block/index.html | 8 +- files/en-us/web/css/padding-bottom/index.html | 6 +- .../web/css/padding-inline-end/index.html | 8 +- .../web/css/padding-inline-start/index.html | 8 +- files/en-us/web/css/padding-inline/index.html | 8 +- files/en-us/web/css/padding-left/index.html | 6 +- files/en-us/web/css/padding-right/index.html | 6 +- files/en-us/web/css/padding-top/index.html | 6 +- files/en-us/web/css/padding/index.html | 10 +- .../en-us/web/css/page-break-after/index.html | 6 +- .../web/css/page-break-before/index.html | 6 +- .../web/css/page-break-inside/index.html | 8 +- files/en-us/web/css/paint()/index.html | 8 +- files/en-us/web/css/paint-order/index.html | 8 +- files/en-us/web/css/path()/index.html | 4 +- files/en-us/web/css/percentage/index.html | 4 +- .../web/css/perspective-origin/index.html | 8 +- files/en-us/web/css/perspective/index.html | 8 +- files/en-us/web/css/place-content/index.html | 12 +- files/en-us/web/css/place-items/index.html | 12 +- files/en-us/web/css/place-self/index.html | 8 +- files/en-us/web/css/pointer-events/index.html | 10 +- files/en-us/web/css/position/index.html | 20 +- files/en-us/web/css/position_value/index.html | 8 +- files/en-us/web/css/pseudo-classes/index.html | 4 +- .../en-us/web/css/pseudo-elements/index.html | 4 +- files/en-us/web/css/quotes/index.html | 12 +- .../web/css/radial-gradient()/index.html | 14 +- files/en-us/web/css/ratio/index.html | 2 +- files/en-us/web/css/reference/index.html | 6 +- files/en-us/web/css/repeat()/index.html | 6 +- .../css/repeating-conic-gradient()/index.html | 18 +- .../repeating-linear-gradient()/index.html | 12 +- .../repeating-radial-gradient()/index.html | 16 +- files/en-us/web/css/resize/index.html | 12 +- files/en-us/web/css/resolution/index.html | 6 +- files/en-us/web/css/revert/index.html | 12 +- files/en-us/web/css/right/index.html | 12 +- files/en-us/web/css/rotate/index.html | 10 +- files/en-us/web/css/row-gap/index.html | 12 +- files/en-us/web/css/ruby-align/index.html | 20 +- files/en-us/web/css/ruby-position/index.html | 12 +- files/en-us/web/css/scale/index.html | 8 +- .../en-us/web/css/scroll-behavior/index.html | 8 +- .../css/scroll-margin-block-end/index.html | 4 +- .../css/scroll-margin-block-start/index.html | 4 +- .../web/css/scroll-margin-block/index.html | 4 +- .../web/css/scroll-margin-bottom/index.html | 4 +- .../css/scroll-margin-inline-end/index.html | 12 +- .../css/scroll-margin-inline-start/index.html | 12 +- .../web/css/scroll-margin-inline/index.html | 12 +- .../web/css/scroll-margin-left/index.html | 4 +- .../web/css/scroll-margin-right/index.html | 4 +- .../web/css/scroll-margin-top/index.html | 4 +- files/en-us/web/css/scroll-margin/index.html | 12 +- .../css/scroll-padding-block-end/index.html | 4 +- .../css/scroll-padding-block-start/index.html | 4 +- .../web/css/scroll-padding-block/index.html | 4 +- .../web/css/scroll-padding-bottom/index.html | 4 +- .../css/scroll-padding-inline-end/index.html | 4 +- .../scroll-padding-inline-start/index.html | 4 +- .../web/css/scroll-padding-inline/index.html | 4 +- .../web/css/scroll-padding-left/index.html | 4 +- .../web/css/scroll-padding-right/index.html | 4 +- .../web/css/scroll-padding-top/index.html | 4 +- files/en-us/web/css/scroll-padding/index.html | 4 +- .../web/css/scroll-snap-align/index.html | 4 +- .../web/css/scroll-snap-coordinate/index.html | 8 +- .../css/scroll-snap-destination/index.html | 8 +- .../web/css/scroll-snap-points-x/index.html | 8 +- .../web/css/scroll-snap-points-y/index.html | 8 +- .../en-us/web/css/scroll-snap-stop/index.html | 8 +- .../web/css/scroll-snap-type-x/index.html | 4 +- .../web/css/scroll-snap-type-y/index.html | 4 +- .../en-us/web/css/scroll-snap-type/index.html | 8 +- .../en-us/web/css/scrollbar-color/index.html | 8 +- .../en-us/web/css/scrollbar-gutter/index.html | 12 +- .../en-us/web/css/scrollbar-width/index.html | 8 +- files/en-us/web/css/selector_list/index.html | 16 +- .../web/css/shape-image-threshold/index.html | 8 +- files/en-us/web/css/shape-margin/index.html | 8 +- files/en-us/web/css/shape-outside/index.html | 8 +- files/en-us/web/css/shape/index.html | 4 +- .../web/css/shorthand_properties/index.html | 18 +- .../en-us/web/css/specified_value/index.html | 4 +- files/en-us/web/css/string/index.html | 2 +- files/en-us/web/css/symbols()/index.html | 6 +- files/en-us/web/css/tab-size/index.html | 12 +- files/en-us/web/css/table-layout/index.html | 8 +- .../en-us/web/css/text-align-last/index.html | 8 +- files/en-us/web/css/text-align/index.html | 22 +- .../web/css/text-combine-upright/index.html | 12 +- .../web/css/text-decoration-color/index.html | 8 +- .../web/css/text-decoration-line/index.html | 8 +- .../css/text-decoration-skip-ink/index.html | 8 +- .../web/css/text-decoration-skip/index.html | 8 +- .../web/css/text-decoration-style/index.html | 10 +- .../css/text-decoration-thickness/index.html | 8 +- .../en-us/web/css/text-decoration/index.html | 6 +- .../web/css/text-emphasis-color/index.html | 8 +- .../web/css/text-emphasis-position/index.html | 8 +- .../web/css/text-emphasis-style/index.html | 6 +- files/en-us/web/css/text-emphasis/index.html | 8 +- files/en-us/web/css/text-indent/index.html | 12 +- files/en-us/web/css/text-justify/index.html | 8 +- .../en-us/web/css/text-orientation/index.html | 8 +- files/en-us/web/css/text-overflow/index.html | 8 +- files/en-us/web/css/text-rendering/index.html | 12 +- files/en-us/web/css/text-shadow/index.html | 12 +- .../en-us/web/css/text-size-adjust/index.html | 6 +- files/en-us/web/css/text-transform/index.html | 56 +-- .../web/css/text-underline-offset/index.html | 8 +- .../css/text-underline-position/index.html | 10 +- .../en-us/web/css/time-percentage/index.html | 8 +- files/en-us/web/css/time/index.html | 4 +- .../tools/cubic_bezier_generator/index.html | 6 +- .../linear-gradient_generator/index.html | 6 +- files/en-us/web/css/top/index.html | 8 +- files/en-us/web/css/touch-action/index.html | 8 +- files/en-us/web/css/transform-box/index.html | 8 +- .../web/css/transform-function/index.html | 6 +- .../transform-function/matrix()/index.html | 6 +- .../transform-function/matrix3d()/index.html | 10 +- .../perspective()/index.html | 6 +- .../transform-function/rotate()/index.html | 10 +- .../transform-function/rotate3d()/index.html | 10 +- .../transform-function/rotatex()/index.html | 6 +- .../transform-function/rotatey()/index.html | 6 +- .../transform-function/rotatez()/index.html | 6 +- .../css/transform-function/scale()/index.html | 10 +- .../transform-function/scale3d()/index.html | 10 +- .../transform-function/scalex()/index.html | 6 +- .../transform-function/scaley()/index.html | 6 +- .../transform-function/scalez()/index.html | 6 +- .../css/transform-function/skew()/index.html | 10 +- .../css/transform-function/skewx()/index.html | 6 +- .../css/transform-function/skewy()/index.html | 6 +- .../transform-function/translate()/index.html | 12 +- .../translate3d()/index.html | 10 +- .../transform-function/translatex/index.html | 8 +- .../translatey()/index.html | 8 +- .../translatez()/index.html | 6 +- .../en-us/web/css/transform-origin/index.html | 48 +-- .../en-us/web/css/transform-style/index.html | 10 +- files/en-us/web/css/transform/index.html | 8 +- .../en-us/web/css/transition-delay/index.html | 28 +- .../web/css/transition-duration/index.html | 28 +- .../web/css/transition-property/index.html | 8 +- .../css/transition-timing-function/index.html | 20 +- files/en-us/web/css/transition/index.html | 8 +- files/en-us/web/css/translate/index.html | 8 +- .../web/css/translation-value/index.html | 6 +- files/en-us/web/css/type_selectors/index.html | 10 +- files/en-us/web/css/unicode-bidi/index.html | 8 +- .../web/css/universal_selectors/index.html | 10 +- files/en-us/web/css/unset/index.html | 8 +- files/en-us/web/css/url()/index.html | 22 +- files/en-us/web/css/used_value/index.html | 6 +- files/en-us/web/css/user-modify/index.html | 8 +- files/en-us/web/css/user-select/index.html | 8 +- .../css/value_definition_syntax/index.html | 22 +- files/en-us/web/css/var()/index.html | 6 +- files/en-us/web/css/vertical-align/index.html | 16 +- .../web/css/viewport_concepts/index.html | 20 +- files/en-us/web/css/visibility/index.html | 12 +- files/en-us/web/css/white-space/index.html | 16 +- files/en-us/web/css/widows/index.html | 8 +- files/en-us/web/css/width/index.html | 24 +- files/en-us/web/css/will-change/index.html | 8 +- files/en-us/web/css/word-break/index.html | 8 +- files/en-us/web/css/word-spacing/index.html | 8 +- files/en-us/web/css/writing-mode/index.html | 10 +- files/en-us/web/css/z-index/index.html | 8 +- files/en-us/web/css/zoom/index.html | 12 +- files/en-us/web/exslt/math/min/index.html | 2 +- .../cross-browser_audio_basics/index.html | 68 ++-- .../guide/audio_and_video_delivery/index.html | 36 +- .../web_audio_api_cross_browser/index.html | 8 +- .../audio_and_video_manipulation/index.html | 26 +- .../css/block_formatting_context/index.html | 12 +- .../creating_and_triggering_events/index.html | 18 +- .../guide/events/event_handlers/index.html | 8 +- .../index.html | 4 +- .../guide/html/content_categories/index.html | 4 +- .../guide/html/editable_content/index.html | 10 +- .../guide/html/html5/html5_parser/index.html | 4 +- .../parsing_and_serializing_xml/index.html | 10 +- .../web/guide/user_input_methods/index.html | 12 +- files/en-us/web/houdini/index.html | 4 +- .../en-us/web/html/applying_color/index.html | 20 +- .../web/html/attributes/accept/index.html | 16 +- .../html/attributes/autocomplete/index.html | 2 +- .../html/attributes/crossorigin/index.html | 4 +- .../web/html/attributes/disabled/index.html | 2 +- files/en-us/web/html/attributes/index.html | 2 +- .../web/html/attributes/maxlength/index.html | 2 +- .../en-us/web/html/attributes/min/index.html | 4 +- .../web/html/attributes/minlength/index.html | 4 +- .../web/html/attributes/multiple/index.html | 16 +- .../web/html/attributes/pattern/index.html | 8 +- .../en-us/web/html/attributes/rel/index.html | 12 +- .../web/html/attributes/required/index.html | 2 +- .../en-us/web/html/attributes/size/index.html | 2 +- .../en-us/web/html/attributes/step/index.html | 4 +- .../web/html/block-level_elements/index.html | 4 +- .../web/html/cors_enabled_image/index.html | 6 +- files/en-us/web/html/element/a/index.html | 32 +- files/en-us/web/html/element/abbr/index.html | 12 +- .../en-us/web/html/element/address/index.html | 2 +- files/en-us/web/html/element/area/index.html | 2 +- .../en-us/web/html/element/article/index.html | 2 +- files/en-us/web/html/element/base/index.html | 4 +- files/en-us/web/html/element/br/index.html | 2 +- .../en-us/web/html/element/canvas/index.html | 4 +- .../en-us/web/html/element/caption/index.html | 4 +- files/en-us/web/html/element/cite/index.html | 2 +- files/en-us/web/html/element/code/index.html | 2 +- files/en-us/web/html/element/data/index.html | 2 +- .../web/html/element/datalist/index.html | 8 +- files/en-us/web/html/element/del/index.html | 4 +- files/en-us/web/html/element/div/index.html | 6 +- files/en-us/web/html/element/dl/index.html | 12 +- files/en-us/web/html/element/em/index.html | 2 +- files/en-us/web/html/element/embed/index.html | 2 +- .../web/html/element/fieldset/index.html | 4 +- .../en-us/web/html/element/footer/index.html | 2 +- files/en-us/web/html/element/form/index.html | 2 +- .../en-us/web/html/element/header/index.html | 4 +- .../html/element/heading_elements/index.html | 10 +- files/en-us/web/html/element/i/index.html | 2 +- .../en-us/web/html/element/iframe/index.html | 4 +- .../web/html/element/input/button/index.html | 28 +- .../html/element/input/checkbox/index.html | 16 +- .../web/html/element/input/color/index.html | 16 +- .../web/html/element/input/date/index.html | 22 +- .../element/input/datetime-local/index.html | 30 +- .../web/html/element/input/email/index.html | 22 +- .../web/html/element/input/file/index.html | 28 +- .../web/html/element/input/hidden/index.html | 6 +- .../web/html/element/input/image/index.html | 10 +- files/en-us/web/html/element/input/index.html | 74 ++-- .../web/html/element/input/month/index.html | 24 +- .../web/html/element/input/number/index.html | 28 +- .../html/element/input/password/index.html | 20 +- .../web/html/element/input/radio/index.html | 12 +- .../web/html/element/input/range/index.html | 40 +- .../web/html/element/input/reset/index.html | 10 +- .../web/html/element/input/search/index.html | 24 +- .../web/html/element/input/submit/index.html | 12 +- .../web/html/element/input/tel/index.html | 26 +- .../web/html/element/input/text/index.html | 22 +- .../web/html/element/input/time/index.html | 30 +- .../web/html/element/input/url/index.html | 20 +- .../web/html/element/input/week/index.html | 18 +- files/en-us/web/html/element/ins/index.html | 4 +- .../en-us/web/html/element/isindex/index.html | 4 +- files/en-us/web/html/element/kbd/index.html | 12 +- .../en-us/web/html/element/keygen/index.html | 6 +- files/en-us/web/html/element/label/index.html | 14 +- files/en-us/web/html/element/li/index.html | 6 +- files/en-us/web/html/element/link/index.html | 20 +- files/en-us/web/html/element/main/index.html | 4 +- files/en-us/web/html/element/map/index.html | 2 +- .../web/html/element/menuitem/index.html | 4 +- files/en-us/web/html/element/meta/index.html | 2 +- .../web/html/element/meta/name/index.html | 2 +- files/en-us/web/html/element/meter/index.html | 4 +- .../web/html/element/noscript/index.html | 2 +- .../en-us/web/html/element/object/index.html | 2 +- files/en-us/web/html/element/ol/index.html | 10 +- .../web/html/element/optgroup/index.html | 2 +- .../en-us/web/html/element/output/index.html | 2 +- .../en-us/web/html/element/picture/index.html | 6 +- files/en-us/web/html/element/q/index.html | 2 +- files/en-us/web/html/element/rb/index.html | 12 +- files/en-us/web/html/element/rtc/index.html | 4 +- files/en-us/web/html/element/ruby/index.html | 4 +- files/en-us/web/html/element/s/index.html | 4 +- .../en-us/web/html/element/script/index.html | 8 +- .../en-us/web/html/element/select/index.html | 10 +- .../en-us/web/html/element/source/index.html | 4 +- .../en-us/web/html/element/strike/index.html | 2 +- files/en-us/web/html/element/table/index.html | 20 +- files/en-us/web/html/element/tbody/index.html | 14 +- .../web/html/element/template/index.html | 10 +- .../web/html/element/textarea/index.html | 12 +- files/en-us/web/html/element/tr/index.html | 32 +- files/en-us/web/html/element/track/index.html | 2 +- files/en-us/web/html/element/tt/index.html | 6 +- files/en-us/web/html/element/u/index.html | 12 +- files/en-us/web/html/element/ul/index.html | 6 +- files/en-us/web/html/element/video/index.html | 14 +- .../html/global_attributes/title/index.html | 4 +- .../global_attributes/translate/index.html | 2 +- files/en-us/web/html/microdata/index.html | 2 +- .../web/html/preloading_content/index.html | 14 +- .../quirks_mode_and_standards_mode/index.html | 2 +- .../using_the_application_cache/index.html | 14 +- .../web/html/viewport_meta_tag/index.html | 8 +- .../web/manifest/background_color/index.html | 2 +- files/en-us/web/manifest/icons/index.html | 2 +- files/en-us/web/manifest/index.html | 4 +- files/en-us/web/manifest/shortcuts/index.html | 2 +- files/en-us/web/mathml/authoring/index.html | 36 +- .../web/mathml/element/maction/index.html | 4 +- .../web/mathml/element/menclose/index.html | 2 +- .../web/mathml/element/merror/index.html | 2 +- .../en-us/web/mathml/element/mfrac/index.html | 4 +- files/en-us/web/mathml/element/mi/index.html | 2 +- .../mathml/element/mmultiscripts/index.html | 6 +- files/en-us/web/mathml/element/mn/index.html | 2 +- files/en-us/web/mathml/element/mo/index.html | 2 +- .../en-us/web/mathml/element/mover/index.html | 2 +- .../web/mathml/element/mpadded/index.html | 2 +- .../web/mathml/element/mphantom/index.html | 2 +- .../en-us/web/mathml/element/mroot/index.html | 2 +- .../en-us/web/mathml/element/mrow/index.html | 2 +- files/en-us/web/mathml/element/ms/index.html | 2 +- .../web/mathml/element/mspace/index.html | 2 +- .../en-us/web/mathml/element/msqrt/index.html | 2 +- .../web/mathml/element/mstyle/index.html | 2 +- .../en-us/web/mathml/element/msub/index.html | 2 +- .../web/mathml/element/msubsup/index.html | 2 +- .../en-us/web/mathml/element/msup/index.html | 2 +- .../web/mathml/element/mtable/index.html | 2 +- .../en-us/web/mathml/element/mtext/index.html | 2 +- .../web/mathml/element/munder/index.html | 2 +- .../web/mathml/element/munderover/index.html | 2 +- .../web/mathml/element/semantics/index.html | 2 +- .../security/same-origin_policy/index.html | 2 +- .../web/security/secure_contexts/index.html | 2 +- .../index.html | 6 +- .../attribute/alignment-baseline/index.html | 2 +- files/en-us/web/svg/attribute/d/index.html | 28 +- .../attribute/dominant-baseline/index.html | 6 +- .../web/svg/attribute/fill-opacity/index.html | 4 +- .../web/svg/attribute/fill-rule/index.html | 12 +- .../web/svg/attribute/font-style/index.html | 4 +- files/en-us/web/svg/attribute/id/index.html | 2 +- .../web/svg/attribute/marker-end/index.html | 4 +- .../web/svg/attribute/marker-mid/index.html | 4 +- .../web/svg/attribute/marker-start/index.html | 4 +- .../web/svg/attribute/operator/index.html | 4 +- .../web/svg/attribute/overflow/index.html | 4 +- .../web/svg/attribute/paint-order/index.html | 4 +- .../svg/attribute/pointer-events/index.html | 6 +- .../attribute/preserveaspectratio/index.html | 2 +- .../svg/attribute/shape-rendering/index.html | 4 +- .../svg/attribute/stroke-linecap/index.html | 16 +- .../svg/attribute/stroke-linejoin/index.html | 24 +- .../web/svg/attribute/text-anchor/index.html | 4 +- .../svg/attribute/text-rendering/index.html | 4 +- .../web/svg/attribute/transform/index.html | 2 +- .../svg/attribute/vector-effect/index.html | 2 +- .../web/svg/attribute/viewbox/index.html | 4 +- files/en-us/web/svg/element/a/index.html | 6 +- .../web/svg/element/animatemotion/index.html | 4 +- .../web/svg/element/fecolormatrix/index.html | 10 +- .../element/fecomponenttransfer/index.html | 4 +- .../web/svg/element/fedropshadow/index.html | 4 +- files/en-us/web/svg/element/filter/index.html | 2 +- files/en-us/web/svg/element/image/index.html | 2 +- .../web/svg/element/radialgradient/index.html | 4 +- .../web/svg/element/solidcolor/index.html | 2 +- files/en-us/web/svg/element/svg/index.html | 4 +- files/en-us/web/svg/element/text/index.html | 4 +- files/en-us/web/svg/element/tspan/index.html | 4 +- files/en-us/web/svg/element/use/index.html | 4 +- files/en-us/web/svg/tutorial/paths/index.html | 40 +- .../tutorial/svg_filters_tutorial/index.html | 4 +- .../web/xpath/functions/boolean/index.html | 2 +- .../functions/system-property/index.html | 2 +- 1001 files changed, 4797 insertions(+), 4797 deletions(-) diff --git a/files/en-us/web/css/--_star_/index.html b/files/en-us/web/css/--_star_/index.html index 4433a1b3b9c398b..0419be4984df735 100644 --- a/files/en-us/web/css/--_star_/index.html +++ b/files/en-us/web/css/--_star_/index.html @@ -17,7 +17,7 @@

Syntax

-
--somekeyword: left;
+
--somekeyword: left;
 --somecolor: #0000ff;
 --somecomplexvalue: 3px 6px rgb(20, 32, 54);
 
@@ -33,13 +33,13 @@

Syntax

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Example

HTML

-
<p id="firstParagraph">This paragraph should have a blue background and yellow text.</p>
+
<p id="firstParagraph">This paragraph should have a blue background and yellow text.</p>
 <p id="secondParagraph">This paragraph should have a yellow background and blue text.</p>
 <div id="container">
   <p id="thirdParagraph">This paragraph should have a green background and yellow text.</p>
@@ -47,7 +47,7 @@ 

HTML

CSS

-
:root {
+
:root {
   --first-color: #16f;
   --second-color: #ff7;
 }
diff --git a/files/en-us/web/css/-moz-context-properties/index.html b/files/en-us/web/css/-moz-context-properties/index.html
index c107f63561fdd5c..02af590d3126bf0 100644
--- a/files/en-us/web/css/-moz-context-properties/index.html
+++ b/files/en-us/web/css/-moz-context-properties/index.html
@@ -20,7 +20,7 @@
 
 

Syntax

-
/* Keyword values */
+
/* Keyword values */
 -moz-context-properties: fill;
 -moz-context-properties: fill, stroke;
 
@@ -49,7 +49,7 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -59,7 +59,7 @@

Exposing fill and stroke to an

You first need to specify on the embedding element the properties whose values you wish to expose to the embedded SVG, using the -moz-context-properties property. For example:

-
.img1 {
+
.img1 {
   width: 100px;
   height: 100px;
   -moz-context-properties: fill, stroke;
@@ -69,7 +69,7 @@ 

Exposing fill and stroke to an

Now that you've done this, the SVG image can use the values of the {{cssxref("fill")}} and {{cssxref("stroke")}} properties, for example:

-
<img class="img1" src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'>
+
<img class="img1" src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'>
                        <rect width='100%' height='100%' stroke-width='30px'
                        fill='context-fill red' stroke='context-stroke' fill-opacity='0.5'/></svg>">
diff --git a/files/en-us/web/css/-moz-float-edge/index.html b/files/en-us/web/css/-moz-float-edge/index.html index 3c01d2fddb3cd7a..397767d49cd0b3b 100644 --- a/files/en-us/web/css/-moz-float-edge/index.html +++ b/files/en-us/web/css/-moz-float-edge/index.html @@ -14,7 +14,7 @@

The non-standard -moz-float-edge CSS property specifies whether the height and width properties of the element include the margin, border, or padding thickness.

-
/* Keyword values */
+
/* Keyword values */
 -moz-float-edge: border-box;
 -moz-float-edge: content-box;
 -moz-float-edge: margin-box;
@@ -47,19 +47,19 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<div class="box">
+
<div class="box">
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 </div>

CSS

-
.box {
+
.box {
   display: block;
   height: 5px;
   margin: 0.5em auto 0.5em auto;
diff --git a/files/en-us/web/css/-moz-force-broken-image-icon/index.html b/files/en-us/web/css/-moz-force-broken-image-icon/index.html
index 62d26d56e3ef279..88e91cd16597b8e 100644
--- a/files/en-us/web/css/-moz-force-broken-image-icon/index.html
+++ b/files/en-us/web/css/-moz-force-broken-image-icon/index.html
@@ -29,17 +29,17 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<img src='/broken/image/link.png' alt='Broken image link'>
+
<img src='/broken/image/link.png' alt='Broken image link'>

CSS

-
img {
+
img {
   -moz-force-broken-image-icon: 1;
   height: 100px;
   width: 100px;
diff --git a/files/en-us/web/css/-moz-image-rect/index.html b/files/en-us/web/css/-moz-image-rect/index.html
index cd77688c815c8f2..d2cf6cfc62af7af 100644
--- a/files/en-us/web/css/-moz-image-rect/index.html
+++ b/files/en-us/web/css/-moz-image-rect/index.html
@@ -16,7 +16,7 @@
 
 

Syntax

-
-moz-image-rect({{CSSxRef("<uri>")}}, top, right, bottom, left);
+
-moz-image-rect({{CSSxRef("<uri>")}}, top, right, bottom, left);

Values

@@ -51,7 +51,7 @@

CSS

The container looks like this:

-
#container {
+
#container {
   width:267px;
   height:272px;
   top:100px;
@@ -64,7 +64,7 @@ 

CSS

Then the four boxes defining the segments of the image are defined. Let's look at them one at a time.

-
#box1 {
+
#box1 {
   background-image: -moz-image-rect(url(https://mdn.mozillademos.org/files/12053/firefox.png), 0%, 50%, 50%, 0%);
   width:133px;
   height:136px;
@@ -74,7 +74,7 @@ 

CSS

This is the top-left corner of the image. It defines a rectangle containing the top-left quarter of the image in the file firefox.jpg.

-
#box2 {
+
#box2 {
   background-image: -moz-image-rect(url(https://mdn.mozillademos.org/files/12053/firefox.png), 0%, 100%, 50%, 50%);
   width:133px;
   height:136px;
@@ -86,7 +86,7 @@ 

CSS

The other corners follow a similar pattern:

-
#box3 {
+
#box3 {
   background-image: -moz-image-rect(url(https://mdn.mozillademos.org/files/12053/firefox.png), 50%, 50%, 100%, 0%);
   width:133px;
   height:136px;
@@ -104,7 +104,7 @@ 

HTML

The HTML is quite simple:

-
<div id="container" onclick="rotate()">
+
<div id="container" onclick="rotate()">
   <div id="box1" style="left:0px;top:0px;">Top left</div>
   <div id="box2" style="left:133px;top:0px;">Top right</div>
   <div id="box3" style="left:0px;top:136px;">Bottom left</div>
@@ -118,7 +118,7 @@ 

The JavaScript code

This code handles the click event when the container receives a mouse click.

-
function rotate() {
+
function rotate() {
   var prevStyle = window.getComputedStyle(document.getElementById("box4"), null).getPropertyValue("background-image");
 
   // Now that we've saved the last one, start rotating
diff --git a/files/en-us/web/css/-moz-image-region/index.html b/files/en-us/web/css/-moz-image-region/index.html
index c32efbfe6a067c0..015787a2277c22b 100644
--- a/files/en-us/web/css/-moz-image-region/index.html
+++ b/files/en-us/web/css/-moz-image-region/index.html
@@ -13,7 +13,7 @@
 
 

For certain XUL elements and pseudo-elements that use an image from the {{CSSxRef("list-style-image")}} property, this property specifies a region of the image that is used in place of the whole image. This allows elements to use different pieces of the same image to improve performance.

-
/* Keyword value */
+
/* Keyword value */
 -moz-image-region: auto;
 
 /* <shape> value */
@@ -47,13 +47,13 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Clipping an image

-
#example-button {
+
#example-button {
   /* display only the 4x4 area from the top left of this image */
   list-style-image: url("chrome://example/skin/example.png");
   -moz-image-region: rect(0px, 4px, 4px, 0px);
diff --git a/files/en-us/web/css/-moz-orient/index.html b/files/en-us/web/css/-moz-orient/index.html
index 15540dd8ba48e6b..7feee771836a6d7 100644
--- a/files/en-us/web/css/-moz-orient/index.html
+++ b/files/en-us/web/css/-moz-orient/index.html
@@ -35,13 +35,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<p>
+
<p>
   The following progress meter
   is horizontal (the default):
 </p>
@@ -55,7 +55,7 @@ 

HTML

CSS

-
.vert {
+
.vert {
   -moz-orient: vertical;
   width: 16px;
   height: 150px;
diff --git a/files/en-us/web/css/-moz-outline-radius-bottomleft/index.html b/files/en-us/web/css/-moz-outline-radius-bottomleft/index.html
index 8fc376a0caf4c51..fc5772ed367c0b8 100644
--- a/files/en-us/web/css/-moz-outline-radius-bottomleft/index.html
+++ b/files/en-us/web/css/-moz-outline-radius-bottomleft/index.html
@@ -33,7 +33,7 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -43,11 +43,11 @@

Rounding a outline

HTML

-
<p>Look at this paragraph's bottom-left corner.</p>
+
<p>Look at this paragraph's bottom-left corner.</p>

CSS

-
p {
+
p {
   margin: 10px;
   border: solid cyan;
   outline: dotted green;
diff --git a/files/en-us/web/css/-moz-outline-radius-bottomright/index.html b/files/en-us/web/css/-moz-outline-radius-bottomright/index.html
index 160e7136d25aafd..8afe248f78eddd8 100644
--- a/files/en-us/web/css/-moz-outline-radius-bottomright/index.html
+++ b/files/en-us/web/css/-moz-outline-radius-bottomright/index.html
@@ -33,17 +33,17 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

HTML

-
<p>Look at this paragraph's bottom-right corner.</p>
+
<p>Look at this paragraph's bottom-right corner.</p>

CSS

-
p {
+
p {
   margin: 5px;
   border: solid cyan;
   outline: dotted red;
diff --git a/files/en-us/web/css/-moz-outline-radius-topleft/index.html b/files/en-us/web/css/-moz-outline-radius-topleft/index.html
index 3ef4a50e5f647b1..dc32a8a569a5d31 100644
--- a/files/en-us/web/css/-moz-outline-radius-topleft/index.html
+++ b/files/en-us/web/css/-moz-outline-radius-topleft/index.html
@@ -33,7 +33,7 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -41,11 +41,11 @@

Examples

HTML

-
<p>Look at this paragraph's top-left corner.</p>
+
<p>Look at this paragraph's top-left corner.</p>

CSS

-
p {
+
p {
   margin: 5px;
   border: solid cyan;
   outline: dotted red;
diff --git a/files/en-us/web/css/-moz-outline-radius-topright/index.html b/files/en-us/web/css/-moz-outline-radius-topright/index.html
index 5ba5634828653ee..f093519e392a45f 100644
--- a/files/en-us/web/css/-moz-outline-radius-topright/index.html
+++ b/files/en-us/web/css/-moz-outline-radius-topright/index.html
@@ -33,17 +33,17 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

HTML

-
<p>Look at this paragraph's top-right corner.</p>
+
<p>Look at this paragraph's top-right corner.</p>

CSS

-
p {
+
p {
   margin: 5px;
   border: solid cyan;
   outline: dotted red;
diff --git a/files/en-us/web/css/-moz-outline-radius/index.html b/files/en-us/web/css/-moz-outline-radius/index.html
index 528ca194dba248a..164ee5f8e423ffa 100644
--- a/files/en-us/web/css/-moz-outline-radius/index.html
+++ b/files/en-us/web/css/-moz-outline-radius/index.html
@@ -13,7 +13,7 @@
 
 

In Mozilla applications like Firefox, the -moz-outline-radius CSS shorthand property can be used to give an element's {{cssxref("outline")}} rounded corners.

-
/* One value */
+
/* One value */
 -moz-outline-radius: 25px;
 
 /* Two values */
@@ -70,7 +70,7 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -80,11 +80,11 @@

Rounding an outline

HTML

-
<p>This element has a rounded outline!</p>
+
<p>This element has a rounded outline!</p>

CSS

-
p {
+
p {
   margin: 5px;
   border: 1px solid black;
   outline: dotted red;
diff --git a/files/en-us/web/css/-moz-user-focus/index.html b/files/en-us/web/css/-moz-user-focus/index.html
index f917d36296f882a..ed23acd40af61bd 100644
--- a/files/en-us/web/css/-moz-user-focus/index.html
+++ b/files/en-us/web/css/-moz-user-focus/index.html
@@ -14,7 +14,7 @@
 
 

The -moz-user-focus CSS property is used to indicate whether an element can have the focus.

-
/* Keyword values */
+
/* Keyword values */
 -moz-user-focus: normal;
 -moz-user-focus: ignore;
 
@@ -59,18 +59,18 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<input class="ignored" value="The user cannot focus on this element.">
+
<input class="ignored" value="The user cannot focus on this element.">
 

CSS

-
.ignored {
+
.ignored {
   -moz-user-focus: ignore;
 }
diff --git a/files/en-us/web/css/-moz-user-input/index.html b/files/en-us/web/css/-moz-user-input/index.html index c286f4b0c580f22..5b2b634d7954efd 100644 --- a/files/en-us/web/css/-moz-user-input/index.html +++ b/files/en-us/web/css/-moz-user-input/index.html @@ -14,7 +14,7 @@

In Mozilla applications, -moz-user-input determines if an element will accept user input.

-
/* Keyword values */
+
/* Keyword values */
 -moz-user-input: none;
 -moz-user-input: enabled;
 -moz-user-input: disabled;
@@ -50,13 +50,13 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Disabling user input for an element

-
input.example {
+
input.example {
   /* The user will be able to select the text, but not change it. */
   -moz-user-input: disabled;
 }
diff --git a/files/en-us/web/css/-webkit-border-before/index.html b/files/en-us/web/css/-webkit-border-before/index.html
index 16b880de32e0cbe..aaca13b6fb36bb6 100644
--- a/files/en-us/web/css/-webkit-border-before/index.html
+++ b/files/en-us/web/css/-webkit-border-before/index.html
@@ -14,7 +14,7 @@
 
 

The -webkit-border-before CSS property is a shorthand property for setting the individual logical block start border property values in a single place in the style sheet.

-
/* Border values */
+
/* Border values */
 -webkit-border-before: 1px;
 -webkit-border-before: 2px dotted;
 -webkit-border-before: medium dashed blue;
@@ -52,7 +52,7 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -60,14 +60,14 @@

Applying a border with vertical te

HTML

-
<div>
+
<div>
   <p class="exampleText">Example text</p>
 </div>
 

CSS

-
div {
+
div {
   background-color: yellow;
   width: 120px;
   height: 120px;
diff --git a/files/en-us/web/css/-webkit-box-reflect/index.html b/files/en-us/web/css/-webkit-box-reflect/index.html
index e08d48f1a3621bc..aec47cba99e12dd 100644
--- a/files/en-us/web/css/-webkit-box-reflect/index.html
+++ b/files/en-us/web/css/-webkit-box-reflect/index.html
@@ -14,7 +14,7 @@
 
 

The -webkit-box-reflect CSS property lets you reflect the content of an element in one specific direction.

-
/* Direction values */
+
/* Direction values */
 -webkit-box-reflect: above;
 -webkit-box-reflect: below;
 -webkit-box-reflect: left;
@@ -53,7 +53,7 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/-webkit-line-clamp/index.html b/files/en-us/web/css/-webkit-line-clamp/index.html index d4b816223a035e6..fdc87b2290239d7 100644 --- a/files/en-us/web/css/-webkit-line-clamp/index.html +++ b/files/en-us/web/css/-webkit-line-clamp/index.html @@ -24,7 +24,7 @@

Syntax

-
/* Keyword value */
+
/* Keyword value */
 -webkit-line-clamp: none;
 
 /* <integer> values */
@@ -50,7 +50,7 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -58,14 +58,14 @@

Truncating a paragraph

HTML

-
<p>
+
<p>
   In this example the <code>-webkit-line-clamp</code> property is set to <code>3</code>, which means the text is clamped after three lines.
   An ellipsis will be shown at the point where the text is clamped.
 </p>

CSS

-
p {
+
p {
   width: 300px;
   display: -webkit-box;
   -webkit-box-orient: vertical;
diff --git a/files/en-us/web/css/-webkit-mask-attachment/index.html b/files/en-us/web/css/-webkit-mask-attachment/index.html
index 28fdffe4dae9faf..296c76b2ed50b1d 100644
--- a/files/en-us/web/css/-webkit-mask-attachment/index.html
+++ b/files/en-us/web/css/-webkit-mask-attachment/index.html
@@ -14,7 +14,7 @@
 
 

If a {{CSSxRef("-webkit-mask-image")}} is specified, -webkit-mask-attachment determines whether the mask image's position is fixed within the viewport, or scrolls along with its containing block.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-mask-attachment: scroll;
 -webkit-mask-attachment: fixed;
 -webkit-mask-attachment: local;
@@ -46,13 +46,13 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Fixing a mask image to the viewport

-
body {
+
body {
   -webkit-mask-image: url('images/mask.png');
   -webkit-mask-attachment: fixed;
 }
diff --git a/files/en-us/web/css/-webkit-mask-box-image/index.html b/files/en-us/web/css/-webkit-mask-box-image/index.html
index 64d2443813efa21..cece68eaacca697 100644
--- a/files/en-us/web/css/-webkit-mask-box-image/index.html
+++ b/files/en-us/web/css/-webkit-mask-box-image/index.html
@@ -23,7 +23,7 @@
 
 

Syntax

-
-webkit-mask-box-image: <mask-box-image> [<top> <right> <bottom> <left> <x-repeat> <y-repeat>]
+
-webkit-mask-box-image: <mask-box-image> [<top> <right> <bottom> <left> <x-repeat> <y-repeat>]
 

Where:

@@ -66,20 +66,20 @@

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Setting an image

-
.exampleone {
+
.exampleone {
   -webkit-mask-box-image: url('mask.png');
 }
 

Offsetting and filling an image

-
.exampletwo {
+
.exampletwo {
   -webkit-mask-box-image: url('logo.png') 100 100 0 0 round round;
 }
 
diff --git a/files/en-us/web/css/-webkit-mask-composite/index.html b/files/en-us/web/css/-webkit-mask-composite/index.html index e79679435a88bf0..4a1bfe7f79c54d9 100644 --- a/files/en-us/web/css/-webkit-mask-composite/index.html +++ b/files/en-us/web/css/-webkit-mask-composite/index.html @@ -16,7 +16,7 @@

The -webkit-mask-composite property specifies the manner in which multiple mask images applied to the same element are composited with one another. Mask images are composited in the opposite order that they are declared with the {{CSSxRef("-webkit-mask-image")}} property.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-mask-composite: clear;
 -webkit-mask-composite: copy;
 -webkit-mask-composite: source-over;
@@ -74,13 +74,13 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Compositing with XOR

-
.example {
+
.example {
   -webkit-mask-image: url(mask1.png), url('mask2.png');
   -webkit-mask-composite: xor, source-over;
 }
diff --git a/files/en-us/web/css/-webkit-mask-position-x/index.html b/files/en-us/web/css/-webkit-mask-position-x/index.html
index 4f7da340ec3c2a8..758e247208bbf58 100644
--- a/files/en-us/web/css/-webkit-mask-position-x/index.html
+++ b/files/en-us/web/css/-webkit-mask-position-x/index.html
@@ -13,7 +13,7 @@
 
 

The -webkit-mask-position-x CSS property sets the initial horizontal position of a mask image.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-mask-position-x: left;
 -webkit-mask-position-x: center;
 -webkit-mask-position-x: right;
@@ -58,13 +58,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

Horizontally positioning a mask image

-
.exampleOne {
+
.exampleOne {
   -webkit-mask-image: url(mask.png);
   -webkit-mask-position-x: right;
 }
diff --git a/files/en-us/web/css/-webkit-mask-position-y/index.html b/files/en-us/web/css/-webkit-mask-position-y/index.html
index bcb8de8e359dedf..e949dce39f3c4fa 100644
--- a/files/en-us/web/css/-webkit-mask-position-y/index.html
+++ b/files/en-us/web/css/-webkit-mask-position-y/index.html
@@ -13,7 +13,7 @@
 
 

The -webkit-mask-position-y CSS property sets the initial vertical position of a mask image.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-mask-position-y: top;
 -webkit-mask-position-y: center;
 -webkit-mask-position-y: bottom;
@@ -58,13 +58,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

Vertically positioning a mask image

-
.exampleOne {
+
.exampleOne {
   -webkit-mask-image: url(mask.png);
   -webkit-mask-position-y: bottom;
 }
diff --git a/files/en-us/web/css/-webkit-mask-repeat-x/index.html b/files/en-us/web/css/-webkit-mask-repeat-x/index.html
index 5fcfb6d41506c69..948544c97ac3d63 100644
--- a/files/en-us/web/css/-webkit-mask-repeat-x/index.html
+++ b/files/en-us/web/css/-webkit-mask-repeat-x/index.html
@@ -13,7 +13,7 @@
 
 

The -webkit-mask-repeat-x property specifies whether and how a mask image is repeated (tiled) horizontally.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-mask-repeat-x: repeat;
 -webkit-mask-repeat-x: no-repeat;
 -webkit-mask-repeat-x: space;
@@ -51,13 +51,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

Using a repeating or non-repeating mask image

-
.exampleone {
+
.exampleone {
   -webkit-mask-image: url('mask.png');
   -webkit-mask-repeat-x: repeat;
 }
@@ -72,7 +72,7 @@ 

Using multiple mask images

You can specify a different <repeat-style> for each mask image, separated by commas:

-
.examplethree {
+
.examplethree {
   -webkit-mask-image: url('mask1.png'), url('mask2.png');
   -webkit-mask-repeat-x: repeat, space;
 }
diff --git a/files/en-us/web/css/-webkit-mask-repeat-y/index.html b/files/en-us/web/css/-webkit-mask-repeat-y/index.html
index 6f94a06114feb7e..a3bb9eb2724010b 100644
--- a/files/en-us/web/css/-webkit-mask-repeat-y/index.html
+++ b/files/en-us/web/css/-webkit-mask-repeat-y/index.html
@@ -13,7 +13,7 @@
 
 

The -webkit-mask-repeat-y property sets whether and how a mask image is repeated (tiled) vertically.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-mask-repeat-y: repeat;
 -webkit-mask-repeat-y: no-repeat;
 -webkit-mask-repeat-y: space;
@@ -51,13 +51,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

Using a repeating or non-repeating mask image

-
.exampleone {
+
.exampleone {
   -webkit-mask-image: url('mask.png');
   -webkit-mask-repeat-y: repeat;
 }
@@ -72,7 +72,7 @@ 

Using multiple mask images

You can specify a different <repeat-style> for each mask image, separated by commas:

-
.examplethree {
+
.examplethree {
   -webkit-mask-image: url('mask1.png'), url('mask2.png');
   -webkit-mask-repeat-y: repeat, space;
 }
diff --git a/files/en-us/web/css/-webkit-overflow-scrolling/index.html b/files/en-us/web/css/-webkit-overflow-scrolling/index.html
index 8d6071bbe038d0f..c157efe96383350 100644
--- a/files/en-us/web/css/-webkit-overflow-scrolling/index.html
+++ b/files/en-us/web/css/-webkit-overflow-scrolling/index.html
@@ -29,13 +29,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<div class="scroll-touch">
+
<div class="scroll-touch">
   <p>
     This paragraph has momentum scrolling
   </p>
@@ -48,7 +48,7 @@ 

HTML

CSS

-
div {
+
div {
   width: 100%;
   overflow: auto;
 }
diff --git a/files/en-us/web/css/-webkit-print-color-adjust/index.html b/files/en-us/web/css/-webkit-print-color-adjust/index.html
index 7985612ddd1fb08..b74d5dde0fd9886 100644
--- a/files/en-us/web/css/-webkit-print-color-adjust/index.html
+++ b/files/en-us/web/css/-webkit-print-color-adjust/index.html
@@ -13,7 +13,7 @@
 
 

The -webkit-print-color-adjust property is a non-standard CSS extension that can be used to force printing of background colors and images in browsers based on the WebKit engine.

-
/* Keyword values */
+
/* Keyword values */
 -webkit-print-color-adjust: economy;
 -webkit-print-color-adjust: exact;
 
@@ -42,13 +42,13 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Forcing white-on-black printing

-
article {
+
article {
   -webkit-print-color-adjust: exact;
   background: #222;
   color: #eee;
diff --git a/files/en-us/web/css/-webkit-tap-highlight-color/index.html b/files/en-us/web/css/-webkit-tap-highlight-color/index.html
index c1b0fc8d2783902..5ed7f6cdb5fe935 100644
--- a/files/en-us/web/css/-webkit-tap-highlight-color/index.html
+++ b/files/en-us/web/css/-webkit-tap-highlight-color/index.html
@@ -17,7 +17,7 @@
 
 

-webkit-tap-highlight-color is a non-standard CSS property that sets the color of the highlight that appears over a link while it's being tapped. The highlighting indicates to the user that their tap is being successfully recognized, and indicates which element they're tapping on.

-
-webkit-tap-highlight-color: red;
+
-webkit-tap-highlight-color: red;
 -webkit-tap-highlight-color: transparent; /* for removing the highlight */
 
@@ -33,7 +33,7 @@

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Specifications

diff --git a/files/en-us/web/css/-webkit-text-fill-color/index.html b/files/en-us/web/css/-webkit-text-fill-color/index.html index 50b6f79bb2e543d..124b13956b1461e 100644 --- a/files/en-us/web/css/-webkit-text-fill-color/index.html +++ b/files/en-us/web/css/-webkit-text-fill-color/index.html @@ -12,7 +12,7 @@

The -webkit-text-fill-color CSS property specifies the fill color of characters of text. If this property is not set, the value of the {{cssxref("color")}} property is used.

-
/* <color> values */
+
/* <color> values */
 -webkit-text-fill-color: red;
 -webkit-text-fill-color: #000000;
 -webkit-text-fill-color: rgb(100, 200, 0);
@@ -38,7 +38,7 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -46,7 +46,7 @@

Changing the fill color

CSS

-
p {
+
p {
   margin: 0;
   font-size: 3em;
   -webkit-text-fill-color: green;
@@ -55,7 +55,7 @@ 

CSS

HTML

-
<p>This text is green.</p>
+
<p>This text is green.</p>
 

Results

diff --git a/files/en-us/web/css/-webkit-text-security/index.html b/files/en-us/web/css/-webkit-text-security/index.html index c967803e5daaab5..1ccfb743bf47a53 100644 --- a/files/en-us/web/css/-webkit-text-security/index.html +++ b/files/en-us/web/css/-webkit-text-security/index.html @@ -15,7 +15,7 @@

Syntax

-
-webkit-text-security: circle;
+
-webkit-text-security: circle;
 -webkit-text-security: disc;
 -webkit-text-security: square;
 -webkit-text-security: none;
@@ -27,7 +27,7 @@ 

Formal definition

Formal syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -37,12 +37,12 @@

Obscuring a text input

HTML

-
<label for="name">Name:</label>
+
<label for="name">Name:</label>
 <input type="text" name="name" id="name" />

CSS

-
input {
+
input {
   -webkit-text-security: square;
 }
diff --git a/files/en-us/web/css/-webkit-text-stroke-color/index.html b/files/en-us/web/css/-webkit-text-stroke-color/index.html index 74ec9a5357e1281..4cd2bc896c0ae16 100644 --- a/files/en-us/web/css/-webkit-text-stroke-color/index.html +++ b/files/en-us/web/css/-webkit-text-stroke-color/index.html @@ -13,7 +13,7 @@

The -webkit-text-stroke-color CSS property specifies the stroke color of characters of text. If this property is not set, the value of the {{cssxref("color")}} property is used.

-
/* <color> values */
+
/* <color> values */
 -webkit-text-stroke-color: red;
 -webkit-text-stroke-color: #e08ab4;
 -webkit-text-stroke-color: rgb(200, 100, 0);
@@ -39,7 +39,7 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -47,12 +47,12 @@

Varying the stroke color

HTML

-
<p>Text with stroke</p>
+
<p>Text with stroke</p>
 <input type="color" value="#ff0000">

CSS

-
p {
+
p {
   margin: 0;
   font-size: 4em;
   -webkit-text-stroke-width: 3px;
@@ -63,7 +63,7 @@ 

CSS

-
/* Selects a shadow root host, only if it is
+
/* Selects a shadow root host, only if it is
    a descendant of the selector argument given */
 :host-context(h1) {
   font-weight: bold;
@@ -46,7 +46,7 @@
 
 

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -56,11 +56,11 @@

Selectively styling shadow hosts

In this example we have a simple custom element — <context-span> — that you can wrap around text:

-
<h1>Host selectors <a href="#"><context-span>example</context-span></a></h1>
+
<h1>Host selectors <a href="#"><context-span>example</context-span></a></h1>

Inside the element's constructor, we create style and span elements, fill the span with the content of the custom element, and fill the style element with some CSS rules:

-
let style = document.createElement('style');
+
let style = document.createElement('style');
 let span = document.createElement('span');
 span.textContent = this.textContent;
 
diff --git a/files/en-us/web/css/_colon_host/index.html b/files/en-us/web/css/_colon_host/index.html
index 8e69cfe358db4f5..f0d9e003350536d 100644
--- a/files/en-us/web/css/_colon_host/index.html
+++ b/files/en-us/web/css/_colon_host/index.html
@@ -22,7 +22,7 @@
 

Note: This has no effect when used outside a shadow DOM.

-
/* Selects a shadow root host */
+
/* Selects a shadow root host */
 :host {
   font-weight: bold;
 }
@@ -30,7 +30,7 @@
 
 

Syntax

-
:host
+
:host
 

Examples

@@ -41,11 +41,11 @@

Styling the shadow host

In this example we have a simple custom element — <context-span> — that you can wrap around text:

-
<h1>Host selectors <a href="#"><context-span>example</context-span></a></h1>
+
<h1>Host selectors <a href="#"><context-span>example</context-span></a></h1>

Inside the element's constructor, we create style and span elements, fill the span with the content of the custom element, and fill the style element with some CSS rules:

-
let style = document.createElement('style');
+
let style = document.createElement('style');
 let span = document.createElement('span');
 span.textContent = this.textContent;
 
diff --git a/files/en-us/web/css/_colon_hover/index.html b/files/en-us/web/css/_colon_hover/index.html
index 07a8f06b506e98e..483ad12009483b6 100644
--- a/files/en-us/web/css/_colon_hover/index.html
+++ b/files/en-us/web/css/_colon_hover/index.html
@@ -13,7 +13,7 @@
 
 

The :hover CSS pseudo-class matches when the user interacts with an element with a pointing device, but does not necessarily activate it. It is generally triggered when the user hovers over an element with the cursor (mouse pointer).

-
/* Selects any <a> element when "hovered" */
+
/* Selects any <a> element when "hovered" */
 a:hover {
   color: orange;
 }
@@ -24,7 +24,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -32,11 +32,11 @@

Basic example

HTML

-
<a href="#">Try hovering over this link.</a>
+
<a href="#">Try hovering over this link.</a>

CSS

-
a {
+
a {
   background-color: powderblue;
   transition: background-color .5s;
 }
diff --git a/files/en-us/web/css/_colon_in-range/index.html b/files/en-us/web/css/_colon_in-range/index.html
index 4b5fc25a0451eb6..215a85793f95126 100644
--- a/files/en-us/web/css/_colon_in-range/index.html
+++ b/files/en-us/web/css/_colon_in-range/index.html
@@ -12,7 +12,7 @@
 
 

The :in-range CSS pseudo-class represents an {{htmlelement("input")}} element whose current value is within the range limits specified by the {{htmlattrxref("min", "input")}} and {{htmlattrxref("max","input")}} attributes.

-
/* Selects any <input>, but only when it has a range
+
/* Selects any <input>, but only when it has a range
    specified, and its value is inside that range */
 input:in-range {
   background-color: rgba(0, 255, 0, 0.25);
@@ -24,14 +24,14 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<form action="" id="form1">
+
<form action="" id="form1">
   <ul>Values between 1 and 10 are valid.
     <li>
       <input id="value1" name="value1" type="number" placeholder="1 to 10" min="1" max="10" value="12" required>
@@ -42,7 +42,7 @@ 

HTML

CSS

-
li {
+
li {
   list-style: none;
   margin-bottom: 1em;
 }
diff --git a/files/en-us/web/css/_colon_indeterminate/index.html b/files/en-us/web/css/_colon_indeterminate/index.html
index 75532dfb151b8ee..7975ee1bcea6c6e 100644
--- a/files/en-us/web/css/_colon_indeterminate/index.html
+++ b/files/en-us/web/css/_colon_indeterminate/index.html
@@ -17,7 +17,7 @@
 
 

The :indeterminate CSS pseudo-class represents any form element whose state is indeterminate, such as checkboxes which have their HTML indeterminate attribute set to true, radio buttons which are members of a group in which all radio buttons are unchecked, and indeterminate {{HTMLElement("progress")}} elements.

-
/* Selects any <input> whose state is indeterminate */
+
/* Selects any <input> whose state is indeterminate */
 input:indeterminate {
   background: lime;
 }
@@ -32,7 +32,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -42,7 +42,7 @@

Checkbox & radio button

HTML

-
<div>
+
<div>
   <input type="checkbox" id="checkbox">
   <label for="checkbox">This label starts out lime.</label>
 </div>
@@ -53,14 +53,14 @@ 

HTML

CSS

-
input:indeterminate + label {
+
input:indeterminate + label {
   background: lime;
 }
 

JavaScript

-
var inputs = document.getElementsByTagName("input");
+
var inputs = document.getElementsByTagName("input");
 
 for (var i = 0; i < inputs.length; i++) {
   inputs[i].indeterminate = true;
@@ -73,12 +73,12 @@ 

Progress bar

HTML

-
<progress>
+
<progress>
 

CSS

-
progress {
+
progress {
   margin: 4px;
 }
 
diff --git a/files/en-us/web/css/_colon_invalid/index.html b/files/en-us/web/css/_colon_invalid/index.html
index 5a203ed781fd909..5134d328a7cfacb 100644
--- a/files/en-us/web/css/_colon_invalid/index.html
+++ b/files/en-us/web/css/_colon_invalid/index.html
@@ -13,7 +13,7 @@
 
 

The :invalid CSS pseudo-class represents any {{HTMLElement("input")}} or other {{HTMLElement("form")}} element whose contents fail to validate.

-
/* Selects any invalid <input> */
+
/* Selects any invalid <input> */
 input:invalid {
   background-color: pink;
 }
@@ -22,7 +22,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -30,7 +30,7 @@

HTML

-
<form>
+
<form>
   <div class="field">
     <label for="url_input">Enter a URL:</label>
     <input type="url" id="url_input">
@@ -44,7 +44,7 @@ 

HTML

CSS

-
label {
+
label {
   display: block;
   margin: 1px;
   padding: 1px;
diff --git a/files/en-us/web/css/_colon_is/index.html b/files/en-us/web/css/_colon_is/index.html
index fefdecef960e0d9..bd117edb56799f1 100644
--- a/files/en-us/web/css/_colon_is/index.html
+++ b/files/en-us/web/css/_colon_is/index.html
@@ -19,7 +19,7 @@
 
 

The :is() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list. This is useful for writing large selectors in a more compact form.

-
/* Selects any paragraph inside a header, main
+
/* Selects any paragraph inside a header, main
    or footer element that is being hovered */
 :is(header, main, footer) p:hover {
   color: red;
@@ -39,7 +39,7 @@
 
 

These legacy pseudo-classes can be used to provide backwards compatibility.

-
/* Backwards-compatible version with :-*-any() and :matches()
+
/* Backwards-compatible version with :-*-any() and :matches()
    (It is not possible to group selectors into single rule,
    because presence of invalid selector would invalidate whole rule.) */
 :-webkit-any(header, main, footer) p:hover {
@@ -62,13 +62,13 @@ 

Forgiving Selector Parsing

In CSS when using a selector list, if any of the selectors are invalid then the whole list is deemed invalid. When using :is() or :where() instead of the whole list of selectors being deemed invalid if one fails to parse, the incorrect or unsupported selector will be ignored and the others used.

-
:is(:valid, :unsupported) {
+
:is(:valid, :unsupported) {
   ...
 }

Will still parse correctly and match :valid even in browsers which don't support :unsupported, whereas:

-
:valid, :unsupported {
+
:valid, :unsupported {
   ...
 }
@@ -78,7 +78,7 @@

Examples

Cross-browser example

-
<header>
+
<header>
   <p>This is my header paragraph</p>
 </header>
 
@@ -93,7 +93,7 @@ 

Cross-browser example

<p>This is my footer paragraph</p> </footer>
-
:-webkit-any(header, main, footer) p:hover {
+
:-webkit-any(header, main, footer) p:hover {
   color: red;
   cursor: pointer;
 }
@@ -114,7 +114,7 @@ 

Cross-browser example

}
-
let matchedItems;
+
let matchedItems;
 
 try {
   matchedItems = document.querySelectorAll(':is(header, main, footer) p');
@@ -148,7 +148,7 @@ 

Simplifying list selectors

The :is() pseudo-class can greatly simplify your CSS selectors. For example, the following CSS:

-
/* 3-deep (or more) unordered lists use a square */
+
/* 3-deep (or more) unordered lists use a square */
 ol ol ul,     ol ul ul,     ol menu ul,     ol dir ul,
 ol ol menu,   ol ul menu,   ol menu menu,   ol dir menu,
 ol ol dir,    ol ul dir,    ol menu dir,    ol dir dir,
@@ -167,7 +167,7 @@ 

Simplifying list selectors

... can be replaced with:

-
/* 3-deep (or more) unordered lists use a square */
+
/* 3-deep (or more) unordered lists use a square */
 :is(ol, ul, menu, dir) :is(ol, ul, menu, dir) ul,
 :is(ol, ul, menu, dir) :is(ol, ul, menu, dir) menu,
 :is(ol, ul, menu, dir) :is(ol, ul, menu, dir) dir {
@@ -180,7 +180,7 @@ 

Simplifying section selectors

For example, without :is(), styling all the {{HTMLElement("h1")}} elements at different depths could be very complicated:

-
/* Level 0 */
+
/* Level 0 */
 h1 {
   font-size: 30px;
 }
@@ -201,7 +201,7 @@ 

Simplifying section selectors

Using :is(), though, it's much easier:

-
/* Level 0 */
+
/* Level 0 */
 h1 {
   font-size: 30px;
 }
@@ -228,7 +228,7 @@ 

Difference between :is() and :where()Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/_colon_lang/index.html b/files/en-us/web/css/_colon_lang/index.html index a9cf71be4cf594c..789eafc082cdf5f 100644 --- a/files/en-us/web/css/_colon_lang/index.html +++ b/files/en-us/web/css/_colon_lang/index.html @@ -13,7 +13,7 @@

The :lang() CSS pseudo-class matches elements based on the language they are determined to be in.

-
/* Selects any <p> in English (en) */
+
/* Selects any <p> in English (en) */
 p:lang(en) {
   quotes: '\201C' '\201D' '\2018' '\2019';
 }
@@ -26,7 +26,7 @@

Syntax

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Parameter

@@ -41,14 +41,14 @@

Examples

HTML

-
<div lang="en"><q>This English quote has a <q>nested</q> quote inside.</q></div>
+
<div lang="en"><q>This English quote has a <q>nested</q> quote inside.</q></div>
 <div lang="fr"><q>This French quote has a <q>nested</q> quote inside.</q></div>
 <div lang="de"><q>This German quote has a <q>nested</q> quote inside.</q></div>
 

CSS

-
:lang(en) > q { quotes: '\201C' '\201D' '\2018' '\2019'; }
+
:lang(en) > q { quotes: '\201C' '\201D' '\2018' '\2019'; }
 :lang(fr) > q { quotes: '« ' ' »'; }
 :lang(de) > q { quotes: '»' '«' '\2039' '\203A'; }
 
diff --git a/files/en-us/web/css/_colon_last-child/index.html b/files/en-us/web/css/_colon_last-child/index.html index 9194d5913ba82ff..e11399d9006625b 100644 --- a/files/en-us/web/css/_colon_last-child/index.html +++ b/files/en-us/web/css/_colon_last-child/index.html @@ -13,7 +13,7 @@

The :last-child CSS pseudo-class represents the last element among a group of sibling elements.

-
/* Selects any <p> that is the last element
+
/* Selects any <p> that is the last element
    among its siblings */
 p:last-child {
   color: lime;
@@ -25,7 +25,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -33,7 +33,7 @@

Basic example

HTML

-
<div>
+
<div>
   <p>This text isn't selected.</p>
   <p>This text is selected!</p>
 </div>
@@ -46,7 +46,7 @@ 

HTML

CSS

-
p:last-child {
+
p:last-child {
   color: lime;
   background-color: black;
   padding: 5px;
@@ -61,7 +61,7 @@ 

Styling a list

HTML

-
<ul>
+
<ul>
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3
@@ -75,7 +75,7 @@ 

HTML

CSS

-
ul li {
+
ul li {
   color: blue;
 }
 
diff --git a/files/en-us/web/css/_colon_last-of-type/index.html b/files/en-us/web/css/_colon_last-of-type/index.html
index d77dd995a255236..eb7dd93fbc8a4c2 100644
--- a/files/en-us/web/css/_colon_last-of-type/index.html
+++ b/files/en-us/web/css/_colon_last-of-type/index.html
@@ -13,7 +13,7 @@
 
 

The :last-of-type CSS pseudo-class represents the last element of its type among a group of sibling elements.

-
/* Selects any <p> that is the last element
+
/* Selects any <p> that is the last element
    of its type among its siblings */
 p:last-of-type {
   color: lime;
@@ -25,7 +25,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -34,13 +34,13 @@

Styling the last paragraph

HTML

-
<h2>Heading</h2>
+
<h2>Heading</h2>
 <p>Paragraph 1</p>
 <p>Paragraph 2</p>

CSS

-
p:last-of-type {
+
p:last-of-type {
   color: red;
   font-style: italic;
 }
@@ -55,7 +55,7 @@

Nested elements

HTML

-
<article>
+
<article>
   <div>This `div` is first.</div>
   <div>This <span>nested `span` is last</span>!</div>
   <div>This <em>nested `em` is first</em>, but this <em>nested `em` is last</em>!</div>
@@ -66,7 +66,7 @@ 

HTML

CSS

-
article :last-of-type {
+
article :last-of-type {
   background-color: pink;
 }
diff --git a/files/en-us/web/css/_colon_left/index.html b/files/en-us/web/css/_colon_left/index.html index a64739da98e7f19..3065ae4f131c544 100644 --- a/files/en-us/web/css/_colon_left/index.html +++ b/files/en-us/web/css/_colon_left/index.html @@ -14,7 +14,7 @@

The :left CSS pseudo-class, used with the {{cssxref("@page")}} at-rule, represents all left-hand pages of a printed document.

-
/* Selects any left-hand pages when printing */
+
/* Selects any left-hand pages when printing */
 @page :left {
   margin: 2in 3in;
 }
@@ -27,13 +27,13 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

Setting a margin for left-hand pages

-
@page :left {
+
@page :left {
   margin: 2in 3in;
 }
 
diff --git a/files/en-us/web/css/_colon_link/index.html b/files/en-us/web/css/_colon_link/index.html index e5fccd62ce23e67..889961f4daff6f2 100644 --- a/files/en-us/web/css/_colon_link/index.html +++ b/files/en-us/web/css/_colon_link/index.html @@ -13,7 +13,7 @@

The :link CSS pseudo-class represents an element that has not yet been visited. It matches every unvisited {{HTMLElement("a")}}, {{HTMLElement("area")}}, or {{HTMLElement("link")}} element that has an href attribute.

-
/* Selects any <a> that has not been visited yet */
+
/* Selects any <a> that has not been visited yet */
 a:link {
   color: red;
 }
@@ -26,7 +26,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -34,14 +34,14 @@

Examples

HTML

-
<a href="#ordinary-target">This is an ordinary link.</a><br>
+
<a href="#ordinary-target">This is an ordinary link.</a><br>
 <a href="">You've already visited this link.</a><br>
 <a>Placeholder link (won't get styled)</a>
 

CSS

-
a:link {
+
a:link {
   background-color: gold;
   color: green;
 }
diff --git a/files/en-us/web/css/_colon_local-link/index.html b/files/en-us/web/css/_colon_local-link/index.html
index 34e3aacfdf606f7..12b44cf80c4455c 100644
--- a/files/en-us/web/css/_colon_local-link/index.html
+++ b/files/en-us/web/css/_colon_local-link/index.html
@@ -6,7 +6,7 @@
 
 

The :local-link CSS pseudo-class represents an link to the same document. Therefore an element that is the source anchor of a hyperlink whose target’s absolute URL matches the element’s own document URL.

-
/* Selects any <a> that links to the current document */
+
/* Selects any <a> that links to the current document */
 a:local-link {
   color: green;
 }
@@ -14,19 +14,19 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<a href="#target">This is a link on the current page.</a><br>
+
<a href="#target">This is a link on the current page.</a><br>
 <a href="https://example.com">This is an external link</a><br>
 

CSS

-
a:local-link {
+
a:local-link {
   color: green;
 }
 
diff --git a/files/en-us/web/css/_colon_not/index.html b/files/en-us/web/css/_colon_not/index.html index 0bfaa67c8fb37e4..1da0d8b336aafae 100644 --- a/files/en-us/web/css/_colon_not/index.html +++ b/files/en-us/web/css/_colon_not/index.html @@ -15,7 +15,7 @@

The :not() CSS pseudo-class represents elements that do not match a list of selectors. Since it prevents specific items from being selected, it is known as the negation pseudo-class.

-
/* Selects any element that is NOT a paragraph */
+
/* Selects any element that is NOT a paragraph */
 :not(p) {
   color: blue;
 }
@@ -30,7 +30,7 @@

Syntax

The ability to list more than one selector is experimental and not yet widely supported.

-
{{csssyntax}}
+
{{csssyntax}}

Description

@@ -51,7 +51,7 @@

Basic set of :not() examples

HTML

-
<p>I am a paragraph.</p>
+
<p>I am a paragraph.</p>
 <p class="fancy">I am so very fancy!</p>
 <div>I am NOT a paragraph.</div>
 <h2>
@@ -62,7 +62,7 @@ 

HTML

CSS

-
.fancy {
+
.fancy {
   text-shadow: 2px 2px 3px gold;
 }
 
diff --git a/files/en-us/web/css/_colon_nth-child/index.html b/files/en-us/web/css/_colon_nth-child/index.html
index 663a7aad78adc14..ec8cc15bdcc08b2 100644
--- a/files/en-us/web/css/_colon_nth-child/index.html
+++ b/files/en-us/web/css/_colon_nth-child/index.html
@@ -13,7 +13,7 @@
 
 

The :nth-child() CSS pseudo-class matches elements based on their position in a group of siblings.

-
/* Selects the second <li> element in a list */
+
/* Selects the second <li> element in a list */
 li:nth-child(2) {
   color: lime;
 }
@@ -51,7 +51,7 @@ 

Functional notation

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -85,7 +85,7 @@

Detailed example

HTML

-
<h3><code>span:nth-child(2n+1)</code>, WITHOUT an
+
<h3><code>span:nth-child(2n+1)</code>, WITHOUT an
    <code>&lt;em&gt;</code> among the child elements.</h3>
 <p>Children 1, 3, 5, and 7 are selected.</p>
 <div class="first">
@@ -139,7 +139,7 @@ 

HTML

CSS

-
html {
+
html {
   font-family: sans-serif;
 }
 
diff --git a/files/en-us/web/css/_colon_nth-col/index.html b/files/en-us/web/css/_colon_nth-col/index.html
index bd0a125fa8ad631..da7c398f71a4f90 100644
--- a/files/en-us/web/css/_colon_nth-col/index.html
+++ b/files/en-us/web/css/_colon_nth-col/index.html
@@ -6,7 +6,7 @@
 
 

The :nth-col() CSS pseudo-class is designed for tables and grids. It accepts the An+B notation such as used with the {{Cssxref(":nth-child")}} selector, using this to target every nth column. The values odd and even are also valid. 

-
/* Selects every odd column in a table */
+
/* Selects every odd column in a table */
 :nth-col(odd) {
   background-color: pink;
 }
@@ -19,7 +19,7 @@

Syntax

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -28,7 +28,7 @@

Basic example

HTML

-
<table>
+
<table>
   <tr>
     <td>one</td>
     <td>two</td>
@@ -45,7 +45,7 @@ 

HTML

CSS

-
td {
+
td {
   border: 1px solid #ccc;
   padding: .2em;
 }
diff --git a/files/en-us/web/css/_colon_nth-last-child/index.html b/files/en-us/web/css/_colon_nth-last-child/index.html
index 32283103f400ddd..9377bcbcd183ed6 100644
--- a/files/en-us/web/css/_colon_nth-last-child/index.html
+++ b/files/en-us/web/css/_colon_nth-last-child/index.html
@@ -13,7 +13,7 @@
 
 

The :nth-last-child() CSS pseudo-class matches elements based on their position among a group of siblings, counting from the end.

-
/* Selects every fourth element
+
/* Selects every fourth element
    among any group of siblings,
    counting backwards from the last one */
 :nth-last-child(4n) {
@@ -46,7 +46,7 @@ 

Functional notation

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -76,7 +76,7 @@

Table example

HTML

-
<table>
+
<table>
   <tbody>
     <tr>
       <td>First line</td>
@@ -99,7 +99,7 @@ 

HTML

CSS

-
table {
+
table {
   border: 1px solid blue;
 }
 
@@ -129,7 +129,7 @@ 

Quantity query

HTML

-
<h4>A list of four items (styled):</h4>
+
<h4>A list of four items (styled):</h4>
 <ol>
   <li>One</li>
   <li>Two</li>
@@ -145,7 +145,7 @@ 

HTML

CSS

-
/* If there are at least three list items,
+
/* If there are at least three list items,
    style them all */
 li:nth-last-child(n+3),
 li:nth-last-child(n+3) ~ li {
diff --git a/files/en-us/web/css/_colon_nth-last-col/index.html b/files/en-us/web/css/_colon_nth-last-col/index.html
index a529b429db09765..bf581a9cd2aa26d 100644
--- a/files/en-us/web/css/_colon_nth-last-col/index.html
+++ b/files/en-us/web/css/_colon_nth-last-col/index.html
@@ -6,7 +6,7 @@
 
 

The :nth-last-col() CSS pseudo-class is designed for tables and grids. It accepts the An+B notation such as used with the {{Cssxref(":nth-child")}} selector, using this to target every nth column before it, therefore counting back from the end of the set of columns. The values odd and even are also valid. 

-
/* Selects every odd column in a table */
+
/* Selects every odd column in a table */
 :nth-last-col(odd) {
   background-color: pink;
 }
@@ -19,7 +19,7 @@

Syntax

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -28,7 +28,7 @@

Basic example

HTML

-
<table>
+
<table>
   <tr>
     <td>one</td>
     <td>two</td>
@@ -45,7 +45,7 @@ 

HTML

CSS

-
td {
+
td {
   border: 1px solid #ccc;
   padding: .2em;
 }
diff --git a/files/en-us/web/css/_colon_nth-last-of-type/index.html b/files/en-us/web/css/_colon_nth-last-of-type/index.html
index 549610b6d6762d1..b41b4fe96d6dade 100644
--- a/files/en-us/web/css/_colon_nth-last-of-type/index.html
+++ b/files/en-us/web/css/_colon_nth-last-of-type/index.html
@@ -13,7 +13,7 @@
 
 

The :nth-last-of-type() CSS pseudo-class matches elements of a given type, based on their position among a group of siblings, counting from the end.

-
/* Selects every fourth <p> element
+
/* Selects every fourth <p> element
    among any group of siblings,
    counting backwards from the last one */
 p:nth-last-of-type(4n) {
@@ -32,14 +32,14 @@ 

Syntax

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

HTML

-
<div>
+
<div>
   <span>This is a span.</span>
   <span>This is another span.</span>
   <em>This is emphasized.</em>
@@ -50,7 +50,7 @@ 

HTML

CSS

-
span:nth-last-of-type(2) {
+
span:nth-last-of-type(2) {
   background-color: lime;
 }
diff --git a/files/en-us/web/css/_colon_nth-of-type/index.html b/files/en-us/web/css/_colon_nth-of-type/index.html index 73e514b679d96d8..53ca1959dc31858 100644 --- a/files/en-us/web/css/_colon_nth-of-type/index.html +++ b/files/en-us/web/css/_colon_nth-of-type/index.html @@ -13,7 +13,7 @@

The :nth-of-type() CSS pseudo-class matches elements of a given type (tag name), based on their position among a group of siblings.

-
/* Selects every fourth <p> element
+
/* Selects every fourth <p> element
    among any group of siblings */
 p:nth-of-type(4n) {
   color: lime;
@@ -27,7 +27,7 @@ 

Syntax

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -36,7 +36,7 @@

Basic example

HTML

-
<div>
+
<div>
   <div>This element isn't counted.</div>
   <p>1st paragraph.</p>
   <p>2nd paragraph.</p>
@@ -47,7 +47,7 @@ 

HTML

CSS

-
/* Odd paragraphs */
+
/* Odd paragraphs */
 p:nth-of-type(2n+1) {
   color: red;
 }
diff --git a/files/en-us/web/css/_colon_only-child/index.html b/files/en-us/web/css/_colon_only-child/index.html
index a2b527329237a07..7bcc24d96efee1e 100644
--- a/files/en-us/web/css/_colon_only-child/index.html
+++ b/files/en-us/web/css/_colon_only-child/index.html
@@ -13,7 +13,7 @@
 
 

The :only-child CSS pseudo-class represents an element without any siblings. This is the same as :first-child:last-child or :nth-child(1):nth-last-child(1), but with a lower specificity.

-
/* Selects each <p>, but only if it is the */
+
/* Selects each <p>, but only if it is the */
 /* only child of its parent */
 p:only-child {
   background-color: lime;
@@ -25,7 +25,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -34,7 +34,7 @@

Basic example

HTML

-
<div>
+
<div>
   <div>I am an only child.</div>
 </div>
 
@@ -47,7 +47,7 @@ 

HTML

CSS

-
div:only-child {
+
div:only-child {
   color: red;
 }
 
@@ -66,7 +66,7 @@ 

A list example

HTML

-
<ol>
+
<ol>
   <li>First
     <ul>
       <li>This list has just one element.</li>
@@ -84,7 +84,7 @@ 

HTML

CSS

-
li li {
+
li li {
   list-style-type: disc;
 }
 
diff --git a/files/en-us/web/css/_colon_only-of-type/index.html b/files/en-us/web/css/_colon_only-of-type/index.html
index 3bcfafe4dd6eb8e..ae67b330d0db5c4 100644
--- a/files/en-us/web/css/_colon_only-of-type/index.html
+++ b/files/en-us/web/css/_colon_only-of-type/index.html
@@ -13,7 +13,7 @@
 
 

The :only-of-type CSS pseudo-class represents an element that has no siblings of the same type.

-
/* Selects each <p>, but only if it is the */
+
/* Selects each <p>, but only if it is the */
 /* only <p> element inside its parent */
 p:only-of-type {
   background-color: lime;
@@ -25,7 +25,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

@@ -34,7 +34,7 @@

Styling elements wit

HTML

-
<main>
+
<main>
   <div>I am `div` #1.</div>
   <p>I am the only `p` among my siblings.</p>
   <div>I am `div` #2.</div>
@@ -48,7 +48,7 @@ 

HTML

CSS

-
main :only-of-type {
+
main :only-of-type {
   color: red;
 }
 
diff --git a/files/en-us/web/css/_colon_optional/index.html b/files/en-us/web/css/_colon_optional/index.html index 4c516d446e66dc1..69c1f9723627d06 100644 --- a/files/en-us/web/css/_colon_optional/index.html +++ b/files/en-us/web/css/_colon_optional/index.html @@ -13,7 +13,7 @@

The :optional CSS pseudo-class represents any {{HTMLElement("input")}}, {{HTMLElement("select")}}, or {{HTMLElement("textarea")}} element that does not have the {{ htmlattrxref("required", "input") }} attribute set on it.

-
/* Selects any optional <input> */
+
/* Selects any optional <input> */
 input:optional {
   border: 1px dashed black;
 }
@@ -26,7 +26,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -34,7 +34,7 @@

The optional field has a purple

HTML

-
<form>
+
<form>
   <div class="field">
     <label for="url_input">Enter a URL:</label>
     <input type="url" id="url_input">
@@ -48,7 +48,7 @@ 

HTML

CSS

-
label {
+
label {
   display: block;
   margin: 1px;
   padding: 1px;
diff --git a/files/en-us/web/css/_colon_out-of-range/index.html b/files/en-us/web/css/_colon_out-of-range/index.html
index 264e0a351e1e48b..1f05bf4f177fc53 100644
--- a/files/en-us/web/css/_colon_out-of-range/index.html
+++ b/files/en-us/web/css/_colon_out-of-range/index.html
@@ -14,7 +14,7 @@
 
 

The :out-of-range CSS pseudo-class represents an {{htmlelement("input")}} element whose current value is outside the range limits specified by the {{htmlattrxref("min", "input")}} and {{htmlattrxref("max","input")}} attributes.

-
/* Selects any <input>, but only when it has a range
+
/* Selects any <input>, but only when it has a range
    specified, and its value is outside that range */
 input:out-of-range {
   background-color: rgba(255, 0, 0, 0.25);
@@ -26,14 +26,14 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<form action="" id="form1">
+
<form action="" id="form1">
  <p>Values between 1 and 10 are valid.</p>
   <ul>
     <li>
@@ -45,7 +45,7 @@ 

HTML

CSS

-
li {
+
li {
   list-style: none;
   margin-bottom: 1em;
 }
diff --git a/files/en-us/web/css/_colon_past/index.html b/files/en-us/web/css/_colon_past/index.html
index c78667ef19e6851..1c5010f76ebcf7a 100644
--- a/files/en-us/web/css/_colon_past/index.html
+++ b/files/en-us/web/css/_colon_past/index.html
@@ -6,26 +6,26 @@
 
 

The :past CSS pseudo-class selector is a time-dimensional pseudo-class that will match for any element which appears entirely before an element that matches {{cssxref(":current")}}. For example in a video with captions which are being displayed by WebVTT.

-
:past(p, span) {
+
:past(p, span) {
   display: none;
 }

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

CSS

-
:past(p, span) {
+
:past(p, span) {
   display: none;
 }

HTML

-
<video controls preload="metadata">
+
<video controls preload="metadata">
   <source src="video.mp4" type="video/mp4" />
   <source src="video.webm" type="video/webm" />
   <track label="English" kind="subtitles" srclang="en" src="subtitles.vtt" default>
@@ -33,7 +33,7 @@ 

HTML

WebVTT 

-
WEBVTT FILE
+
WEBVTT FILE
 
 1
 00:00:03.500 --> 00:00:05.000
diff --git a/files/en-us/web/css/_colon_paused/index.html b/files/en-us/web/css/_colon_paused/index.html
index 006839f6b889362..f63d9450c521293 100644
--- a/files/en-us/web/css/_colon_paused/index.html
+++ b/files/en-us/web/css/_colon_paused/index.html
@@ -13,20 +13,20 @@
 
 

A resource is paused either due to being in an non-activated state, or due to the user explicitly paused it.

-
:paused {
+
:paused {
 
 }

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

CSS

-
:paused {
+
:paused {
   border: 5px solid orange;
 }
 
diff --git a/files/en-us/web/css/_colon_picture-in-picture/index.html b/files/en-us/web/css/_colon_picture-in-picture/index.html index 975af4aea3776b4..fdab2d0802759e6 100644 --- a/files/en-us/web/css/_colon_picture-in-picture/index.html +++ b/files/en-us/web/css/_colon_picture-in-picture/index.html @@ -17,7 +17,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Usage notes

@@ -31,7 +31,7 @@

HTML

The page's HTML looks like this:

-
<h1>MDN Web Docs Demo: :picture-in-picture pseudo-class</h1>
+
<h1>MDN Web Docs Demo: :picture-in-picture pseudo-class</h1>
 
 <p>This demo uses the <code>:picture-in-picture</code> pseudo-class to automatically
   change the style of a video entirely using CSS.</p>
@@ -44,7 +44,7 @@ 

CSS

The magic happens in the CSS.

-
:picture-in-picture {
+
:picture-in-picture {
   box-shadow: 0 0 0 5px red;
 }
 
diff --git a/files/en-us/web/css/_colon_placeholder-shown/index.html b/files/en-us/web/css/_colon_placeholder-shown/index.html index 1ee3a1323ba636c..37b92322395f1be 100644 --- a/files/en-us/web/css/_colon_placeholder-shown/index.html +++ b/files/en-us/web/css/_colon_placeholder-shown/index.html @@ -12,14 +12,14 @@

The :placeholder-shown CSS pseudo-class represents any {{HTMLElement("input")}} or {{HTMLElement("textarea")}} element that is currently displaying placeholder text.

-
/* Selects any element with an active placeholder */
+
/* Selects any element with an active placeholder */
 :placeholder-shown {
   border: 2px solid silver;
 }

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -29,11 +29,11 @@

Basic example

HTML

-
<input placeholder="Type something here!">
+
<input placeholder="Type something here!">

CSS

-
input {
+
input {
   border: 1px solid black;
   padding: 3px;
 }
@@ -54,13 +54,13 @@ 

Overflowing text

HTML

-
<input id="input1" placeholder="Name, Rank, and Serial Number">
+
<input id="input1" placeholder="Name, Rank, and Serial Number">
 <br><br>
 <input id="input2" placeholder="Name, Rank, and Serial Number">

CSS

-
#input2:placeholder-shown {
+
#input2:placeholder-shown {
   text-overflow: ellipsis;
 }
@@ -74,7 +74,7 @@

Customized input field

HTML

-
<form id="test">
+
<form id="test">
   <p>
     <label for="name">Enter Student Name:</label>
     <input id="name" placeholder="Student Name"/>
@@ -92,7 +92,7 @@ 

HTML

CSS

-
input {
+
input {
   background-color: #E8E8E8;
   color: black;
 }
diff --git a/files/en-us/web/css/_colon_playing/index.html b/files/en-us/web/css/_colon_playing/index.html
index d9be76b41c35d91..ff8a3df395db83b 100644
--- a/files/en-us/web/css/_colon_playing/index.html
+++ b/files/en-us/web/css/_colon_playing/index.html
@@ -13,20 +13,20 @@
 
 

A resource is playing even if in buffering state or paused for any reason other than a user interaction to cause it to be paused.

-
:playing {
+
:playing {
 
 }

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

CSS

-
:playing {
+
:playing {
   border: 5px solid green;
 }
 
diff --git a/files/en-us/web/css/_colon_read-only/index.html b/files/en-us/web/css/_colon_read-only/index.html index b01e3e6447eea49..2974a2685b56951 100644 --- a/files/en-us/web/css/_colon_read-only/index.html +++ b/files/en-us/web/css/_colon_read-only/index.html @@ -14,7 +14,7 @@

The :read-only CSS pseudo-class represents an element (such as input or textarea) that is not editable by the user.

-
input:read-only, textarea:read-only {
+
input:read-only, textarea:read-only {
   background-color: #ccc;
 }
 
@@ -25,7 +25,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -35,7 +35,7 @@

Confirming

The :read-only pseudo-class is used to remove all the styling that makes the inputs look like clickable fields, making them look more like read-only paragraphs.The :read-write pseudo-class on the other hand is used to provide some nicer styling to the editable <textarea>.

-
input:-moz-read-only, textarea:-moz-read-only,
+
input:-moz-read-only, textarea:-moz-read-only,
 input:read-only, textarea:read-only {
   border: 0;
   box-shadow: none;
@@ -56,11 +56,11 @@ 

Styling read-only non-form controls

This selector doesn't just select {{htmlElement("input")}}/{{htmlElement("textarea")}} elements — it will select any element that cannot be edited by the user.

-
<p contenteditable>This paragraph is editable; it is read-write.</p>
+
<p contenteditable>This paragraph is editable; it is read-write.</p>
 
 <p>This paragraph is not editable; it is read-only.</p>
-
p {
+
p {
   font-size: 150%;
   padding: 5px;
   border-radius: 5px;
diff --git a/files/en-us/web/css/_colon_read-write/index.html b/files/en-us/web/css/_colon_read-write/index.html
index d7299fd5129168c..9a6e667e3e9e1e9 100644
--- a/files/en-us/web/css/_colon_read-write/index.html
+++ b/files/en-us/web/css/_colon_read-write/index.html
@@ -14,7 +14,7 @@
 
 

The :read-write CSS pseudo-class represents an element (such as input or textarea) that is editable by the user.

-
input:read-write, textarea:read-write {
+
input:read-write, textarea:read-write {
   background-color: #bbf;
 }
 
@@ -25,7 +25,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -35,7 +35,7 @@

Confirming

The :read-only pseudo-class is used to remove all the styling that makes the inputs look like clickable fields, making them look more like read-only paragraphs.The :read-write pseudo-class on the other hand is used to provide some nicer styling to the editable <textarea>.

-
input:-moz-read-only, textarea:-moz-read-only,
+
input:-moz-read-only, textarea:-moz-read-only,
 input:read-only, textarea:read-only {
   border: 0;
   box-shadow: none;
@@ -56,11 +56,11 @@ 

Styling read-write non-form contro

This selector doesn't just select {{htmlElement("input")}}/{{htmlElement("textarea")}} elements — it will select any element that can be edited by the user, such as a {{htmlelement("p")}} element with {{htmlattrxref("contenteditable")}} set on it.

-
<p contenteditable>This paragraph is editable; it is read-write.</p>
+
<p contenteditable>This paragraph is editable; it is read-write.</p>
 
 <p>This paragraph is not editable; it is read-only.</p>
-
p {
+
p {
   font-size: 150%;
   padding: 5px;
   border-radius: 5px;
diff --git a/files/en-us/web/css/_colon_required/index.html b/files/en-us/web/css/_colon_required/index.html
index 248f08d99ddbc2a..063748b7f5a7bf7 100644
--- a/files/en-us/web/css/_colon_required/index.html
+++ b/files/en-us/web/css/_colon_required/index.html
@@ -13,7 +13,7 @@
 
 

The :required CSS pseudo-class represents any {{HTMLElement("input")}}, {{HTMLElement("select")}}, or {{HTMLElement("textarea")}} element that has the {{ htmlattrxref("required", "input") }} attribute set on it.

-
/* Selects any required <input> */
+
/* Selects any required <input> */
 input:required {
   border: 1px dashed red;
 }
@@ -26,7 +26,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -34,7 +34,7 @@

The required field has a red border

HTML

-
<form>
+
<form>
   <div class="field">
     <label for="url_input">Enter a URL:</label>
     <input type="url" id="url_input">
@@ -48,7 +48,7 @@ 

HTML

CSS

-
label {
+
label {
   display: block;
   margin: 1px;
   padding: 1px;
diff --git a/files/en-us/web/css/_colon_right/index.html b/files/en-us/web/css/_colon_right/index.html
index 18f5c97202e2764..208628833320a08 100644
--- a/files/en-us/web/css/_colon_right/index.html
+++ b/files/en-us/web/css/_colon_right/index.html
@@ -14,7 +14,7 @@
 
 

The :right CSS pseudo-class, used with the {{cssxref("@page")}} at-rule, represents all right-hand pages of a printed document.

-
/* Selects any right-hand pages when printing */
+
/* Selects any right-hand pages when printing */
 @page :right {
   margin: 2in 3in;
 }
@@ -27,13 +27,13 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

Setting margins for right-hand pages

-
@page :right {
+
@page :right {
   margin: 2in 3in;
 }
 
diff --git a/files/en-us/web/css/_colon_root/index.html b/files/en-us/web/css/_colon_root/index.html index bd792d3cd86dfac..555f12a50c29473 100644 --- a/files/en-us/web/css/_colon_root/index.html +++ b/files/en-us/web/css/_colon_root/index.html @@ -16,7 +16,7 @@

The :root CSS pseudo-class matches the root element of a tree representing the document. In HTML, :root represents the {{HTMLElement("html")}} element and is identical to the selector html, except that its specificity is higher.

-
/* Selects the root element of the document:
+
/* Selects the root element of the document:
    <html> in the case of HTML */
 :root {
   background: yellow;
@@ -24,7 +24,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -32,7 +32,7 @@

Declaring global CSS variables

:root can be useful for declaring global CSS variables:

-
:root {
+
:root {
   --main-color: hotpink;
   --pane-padding: 5px 42px;
 }
diff --git a/files/en-us/web/css/_colon_scope/index.html b/files/en-us/web/css/_colon_scope/index.html
index 40d185360763379..7f6e3592c48e44e 100644
--- a/files/en-us/web/css/_colon_scope/index.html
+++ b/files/en-us/web/css/_colon_scope/index.html
@@ -15,7 +15,7 @@
 
 

The :scope CSS pseudo-class represents elements that are a reference point for selectors to match against.

-
/* Selects a scoped element */
+
/* Selects a scoped element */
 :scope {
   background-color: lime;
 }
@@ -24,7 +24,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -34,7 +34,7 @@

Identity match

JavaScript

-
let paragraph = document.getElementById("para");
+
let paragraph = document.getElementById("para");
 let output = document.getElementById("output");
 
 if (paragraph.matches(":scope")) {
@@ -43,7 +43,7 @@ 

JavaScript

HTML

-
<p id="para">
+
<p id="para">
   This is a paragraph. It is not an interesting paragraph. Sorry about that.
 </p>
 <p id="output"></p>
@@ -58,7 +58,7 @@

Direct children

JavaScript

-
var context = document.getElementById('context');
+
var context = document.getElementById('context');
 var selected = context.querySelectorAll(':scope > div');
 
 document.getElementById('results').innerHTML = Array.prototype.map.call(selected, function (element) {
@@ -67,7 +67,7 @@ 

JavaScript

HTML

-
<div id="context">
+
<div id="context">
     <div id="element-1">
         <div id="element-1.1"></div>
         <div id="element-1.2"></div>
diff --git a/files/en-us/web/css/_colon_state/index.html b/files/en-us/web/css/_colon_state/index.html
index 5bad40c177af325..b525cf59c51a275 100644
--- a/files/en-us/web/css/_colon_state/index.html
+++ b/files/en-us/web/css/_colon_state/index.html
@@ -16,20 +16,20 @@
 
 

The :state CSS pseudo-class represents any custom element with the specified custom state in {{DOMxRef("ElementInternals.states")}}.

-
custom-element:state(foo) {
+
custom-element:state(foo) {
   /* Styles to apply when `custom-element` is in the `foo` state */
 }
 

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

Fill in a simple example that nicely shows a typical usage of the selector, then perhaps some more complex examples (see our guide on how to add code examples for more information).

-
my code block
+
my code block

And/or include a list of links to useful code samples that live elsewhere:

diff --git a/files/en-us/web/css/_colon_target-within/index.html b/files/en-us/web/css/_colon_target-within/index.html index 017d8b94606137f..ee634f44fd98dfa 100644 --- a/files/en-us/web/css/_colon_target-within/index.html +++ b/files/en-us/web/css/_colon_target-within/index.html @@ -6,7 +6,7 @@

The :target-within CSS pseudo-class represents an element that is a target element or contains an element that is a target. A target element is a unique element with an id matching the URL's fragment. In other words, it represents an element that is itself matched by the {{CSSxRef(":target")}} pseudo-class or has a descendant that is matched by :target. (This includes descendants in shadow trees.)

-
/* Selects a <div> when one of its descendants is a target */
+
/* Selects a <div> when one of its descendants is a target */
 div:target-within {
   background: cyan;
 }
@@ -14,7 +14,7 @@
 
 

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -24,7 +24,7 @@

Highlighting an article

HTML

-
<h3>Table of Contents</h3>
+
<h3>Table of Contents</h3>
 <ol>
  <li><a href="#p1">Jump to the first paragraph!</a></li>
  <li><a href="#p2">Jump to the second paragraph!</a></li>
@@ -43,7 +43,7 @@ 

HTML

CSS

-
article:target-within {
+
article:target-within {
   background-color: gold;
 }
 
diff --git a/files/en-us/web/css/_colon_user-invalid/index.html b/files/en-us/web/css/_colon_user-invalid/index.html
index 15dac4bfa0cff6f..90b1b4d5cc3c6ad 100644
--- a/files/en-us/web/css/_colon_user-invalid/index.html
+++ b/files/en-us/web/css/_colon_user-invalid/index.html
@@ -24,7 +24,7 @@
 
 

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/_colon_valid/index.html b/files/en-us/web/css/_colon_valid/index.html index 40bb5bd8d5c212a..92fb11f478bea8a 100644 --- a/files/en-us/web/css/_colon_valid/index.html +++ b/files/en-us/web/css/_colon_valid/index.html @@ -13,7 +13,7 @@

The :valid CSS pseudo-class represents any {{HTMLElement("input")}} or other {{HTMLElement("form")}} element whose contents validate successfully. This allows to easily make valid fields adopt an appearance that helps the user confirm that their data is formatted properly.

-
/* Selects any valid <input> */
+
/* Selects any valid <input> */
 input:valid {
   background-color: powderblue;
 }
@@ -22,7 +22,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -30,7 +30,7 @@

Indicating valid and invalid f

In this example, we use structures like this, which include extra <span>s to generate content on; we'll use these to provide indicators of valid/invalid data:

-
<div>
+
<div>
   <label for="fname">First name *: </label>
   <input id="fname" name="fname" type="text" required>
   <span></span>
@@ -38,7 +38,7 @@ 

Indicating valid and invalid f

To provide these indicators, we use the following CSS:

-
input + span {
+
input + span {
   position: relative;
 }
 
diff --git a/files/en-us/web/css/_colon_visited/index.html b/files/en-us/web/css/_colon_visited/index.html
index c2dfd1bc4958978..b8b15e1ec6e8b1b 100644
--- a/files/en-us/web/css/_colon_visited/index.html
+++ b/files/en-us/web/css/_colon_visited/index.html
@@ -13,7 +13,7 @@
 
 

The :visited CSS pseudo-class represents links that the user has already visited. For privacy reasons, the styles that can be modified using this selector are very limited.

-
/* Selects any <a> that has been visited */
+
/* Selects any <a> that has been visited */
 a:visited {
   color: green;
 }
@@ -38,7 +38,7 @@

Privacy restrictions

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -46,12 +46,12 @@

Examples

HTML

-
<a href="#test-visited-link">Have you visited this link yet?</a><br>
+
<a href="#test-visited-link">Have you visited this link yet?</a><br>
 <a href="">You've already visited this link.</a>

CSS

-
a {
+
a {
   /* Specify non-transparent defaults to certain properties,
      allowing them to be styled with the :visited state */
   background-color: white;
diff --git a/files/en-us/web/css/_colon_where/index.html b/files/en-us/web/css/_colon_where/index.html
index 99d958512e7abf7..5f38e3a0372b093 100644
--- a/files/en-us/web/css/_colon_where/index.html
+++ b/files/en-us/web/css/_colon_where/index.html
@@ -18,7 +18,7 @@
 
 

The :where() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list.

-
/* Selects any paragraph inside a header, main
+
/* Selects any paragraph inside a header, main
    or footer element that is being hovered */
 :where(header, main, footer) p:hover {
   color: red;
@@ -41,13 +41,13 @@ 

Forgiving Selector Parsing

In CSS when using a selector list, if any of the selectors are invalid then the whole list is deemed invalid. When using :is() or :where() instead of the whole list of selectors being deemed invalid if one fails to parse, the incorrect or unsupported selector will be ignored and the others used.

-
:where(:valid, :unsupported) {
+
:where(:valid, :unsupported) {
   ...
 }

Will still parse correctly and match :valid even in browsers which don't support :unsupported, whereas:

-
:valid, :unsupported {
+
:valid, :unsupported {
   ...
 }
@@ -61,7 +61,7 @@

Comparing :where() and :is()

Take the following HTML:

-
<article>
+
<article>
   <h2>:is()-styled links</h2>
   <section class="is-styling">
     <p>Here is my main content. This <a href="https://mozilla.org">contains a link</a>.
@@ -95,7 +95,7 @@ 

Comparing :where() and :is()

To make selecting the links inside them simpler, but still distinct, we could use :is() or :where(), in the following manner:

-
html {
+
html {
   font-family: sans-serif;
   font-size: 150%;
 }
@@ -110,7 +110,7 @@ 

Comparing :where() and :is()

However, what if we later want to override the color of links in the footers using a simple selector?

-
footer a {
+
footer a {
   color: blue;
 }
@@ -124,7 +124,7 @@

Comparing :where() and :is()

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-moz-color-swatch/index.html b/files/en-us/web/css/_doublecolon_-moz-color-swatch/index.html index af502210eac8aa6..e96eb7d67c99ee0 100644 --- a/files/en-us/web/css/_doublecolon_-moz-color-swatch/index.html +++ b/files/en-us/web/css/_doublecolon_-moz-color-swatch/index.html @@ -19,19 +19,19 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}
 

Examples

HTML

-
<input type="color" value="#de2020" />
+
<input type="color" value="#de2020" />
 

CSS

-
input[type=color]::-moz-color-swatch {
+
input[type=color]::-moz-color-swatch {
   border-radius: 10px;
   border-style: none;
 }
diff --git a/files/en-us/web/css/_doublecolon_-moz-focus-inner/index.html b/files/en-us/web/css/_doublecolon_-moz-focus-inner/index.html
index b152052473a490f..6bca3cc6edadcdf 100644
--- a/files/en-us/web/css/_doublecolon_-moz-focus-inner/index.html
+++ b/files/en-us/web/css/_doublecolon_-moz-focus-inner/index.html
@@ -21,19 +21,19 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Example

HTML

-
<input type="submit" value="Input"/>
+
<input type="submit" value="Input"/>
 <button type="submit">Button</button>
 

CSS

-
button::-moz-focus-inner,
+
button::-moz-focus-inner,
 input[type="color"]::-moz-focus-inner,
 input[type="reset"]::-moz-focus-inner,
 input[type="button"]::-moz-focus-inner,
diff --git a/files/en-us/web/css/_doublecolon_-moz-page-sequence/index.html b/files/en-us/web/css/_doublecolon_-moz-page-sequence/index.html
index ca6489b95cd5dd2..4834b5f2d79c8ce 100644
--- a/files/en-us/web/css/_doublecolon_-moz-page-sequence/index.html
+++ b/files/en-us/web/css/_doublecolon_-moz-page-sequence/index.html
@@ -16,7 +16,7 @@
 
 

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-moz-page/index.html b/files/en-us/web/css/_doublecolon_-moz-page/index.html index b95e477c5331494..cd4fa336451432c 100644 --- a/files/en-us/web/css/_doublecolon_-moz-page/index.html +++ b/files/en-us/web/css/_doublecolon_-moz-page/index.html @@ -17,7 +17,7 @@

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-moz-progress-bar/index.html b/files/en-us/web/css/_doublecolon_-moz-progress-bar/index.html index 246dc47b4fa7ed1..7838ad246b9d9a1 100644 --- a/files/en-us/web/css/_doublecolon_-moz-progress-bar/index.html +++ b/files/en-us/web/css/_doublecolon_-moz-progress-bar/index.html @@ -18,18 +18,18 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<progress value="30" max="100">30%</progress>
+
<progress value="30" max="100">30%</progress>
 <progress max="100">Indeterminate</progress>

CSS

-
::-moz-progress-bar {
+
::-moz-progress-bar {
   background-color: red;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_-moz-range-progress/index.html b/files/en-us/web/css/_doublecolon_-moz-range-progress/index.html
index 528c579b9c920ae..2ed6ece8ae64dc9 100644
--- a/files/en-us/web/css/_doublecolon_-moz-range-progress/index.html
+++ b/files/en-us/web/css/_doublecolon_-moz-range-progress/index.html
@@ -19,18 +19,18 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<input type="range" min="0" max="100" step="5" value="50"/>
+
<input type="range" min="0" max="100" step="5" value="50"/>
 

CSS

-
input[type=range]::-moz-range-progress {
+
input[type=range]::-moz-range-progress {
   background-color: green;
   height: 1em;
 }
diff --git a/files/en-us/web/css/_doublecolon_-moz-range-thumb/index.html b/files/en-us/web/css/_doublecolon_-moz-range-thumb/index.html
index 4b9967b4cf95665..d91a41d8054f181 100644
--- a/files/en-us/web/css/_doublecolon_-moz-range-thumb/index.html
+++ b/files/en-us/web/css/_doublecolon_-moz-range-thumb/index.html
@@ -19,18 +19,18 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<input type="range" min="0" max="100" step="5" value="50"/>
+
<input type="range" min="0" max="100" step="5" value="50"/>
 

CSS

-
input[type=range]::-moz-range-thumb {
+
input[type=range]::-moz-range-thumb {
   background-color: green;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_-moz-range-track/index.html b/files/en-us/web/css/_doublecolon_-moz-range-track/index.html index ee3ff1a0fc4babb..2f42613fe51feec 100644 --- a/files/en-us/web/css/_doublecolon_-moz-range-track/index.html +++ b/files/en-us/web/css/_doublecolon_-moz-range-track/index.html @@ -19,18 +19,18 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<input type="range" min="0" max="100" step="5" value="50"/>
+
<input type="range" min="0" max="100" step="5" value="50"/>
 

CSS

-
input[type=range]::-moz-range-track {
+
input[type=range]::-moz-range-track {
   background-color: green;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html b/files/en-us/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html index 1212a8923e88335..1d7133dc5ae3cc1 100644 --- a/files/en-us/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html +++ b/files/en-us/web/css/_doublecolon_-moz-scrolled-page-sequence/index.html @@ -17,7 +17,7 @@

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-webkit-inner-spin-button/index.html b/files/en-us/web/css/_doublecolon_-webkit-inner-spin-button/index.html index abdf2441732152f..e9f3f9fe6611b4f 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-inner-spin-button/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-inner-spin-button/index.html @@ -16,7 +16,7 @@

Syntax

-
::-webkit-inner-spin-button
+
::-webkit-inner-spin-button

Examples

@@ -28,12 +28,12 @@

Changing the cursor in the spi

HTML

-
<input type="number">
+
<input type="number">
 

CSS

-
input[type=number]::-webkit-inner-spin-button {
+
input[type=number]::-webkit-inner-spin-button {
   cursor: pointer;
 }
diff --git a/files/en-us/web/css/_doublecolon_-webkit-meter-bar/index.html b/files/en-us/web/css/_doublecolon_-webkit-meter-bar/index.html index 7045367e4fdf00d..af1c620add80d61 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-meter-bar/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-meter-bar/index.html @@ -16,7 +16,7 @@

Syntax

-
::-webkit-meter-bar
+
::-webkit-meter-bar

Specifications

@@ -26,11 +26,11 @@

Examples

HTML

-
<meter min="0" max="10" value="6">Score out of 10</meter>
+
<meter min="0" max="10" value="6">Score out of 10</meter>

CSS

-
meter {
+
meter {
   /* Reset the default appearance */
   -webkit-appearance: none;
   -moz-appearance: none;
diff --git a/files/en-us/web/css/_doublecolon_-webkit-meter-even-less-good-value/index.html b/files/en-us/web/css/_doublecolon_-webkit-meter-even-less-good-value/index.html
index 33fb01b25d18007..475f2410988a46e 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-meter-even-less-good-value/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-meter-even-less-good-value/index.html
@@ -15,7 +15,7 @@
 
 

Syntax

-
::-webkit-meter-even-less-good-value
+
::-webkit-meter-even-less-good-value

Specifications

@@ -25,11 +25,11 @@

Examples

HTML

-
<meter min="0" max="10" value="6">Score out of 10</meter>
+
<meter min="0" max="10" value="6">Score out of 10</meter>

CSS

-
meter::-webkit-meter-even-less-good-value {
+
meter::-webkit-meter-even-less-good-value {
   background: linear-gradient(to bottom, #f77, #d44 45%, #d44 55%, #f77);
   height: 100%;
   box-sizing: border-box;
diff --git a/files/en-us/web/css/_doublecolon_-webkit-meter-inner-element/index.html b/files/en-us/web/css/_doublecolon_-webkit-meter-inner-element/index.html
index 9e4d61c523759e6..9dc35b1859f60c5 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-meter-inner-element/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-meter-inner-element/index.html
@@ -15,7 +15,7 @@
 
 

Syntax

-
::-webkit-meter-inner-element
+
::-webkit-meter-inner-element

Specifications

@@ -27,11 +27,11 @@

Examples

HTML

-
<meter min="0" max="10" value="6">Score out of 10</meter>
+
<meter min="0" max="10" value="6">Score out of 10</meter>

CSS

-
meter {
+
meter {
   /* Reset the default appearance */
   -webkit-appearance: none;
   -moz-appearance: none;
diff --git a/files/en-us/web/css/_doublecolon_-webkit-meter-optimum-value/index.html b/files/en-us/web/css/_doublecolon_-webkit-meter-optimum-value/index.html
index c24b86ac96c2020..92ae11e3b6ee0ae 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-meter-optimum-value/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-meter-optimum-value/index.html
@@ -17,7 +17,7 @@
 
 

Syntax

-
::-webkit-meter-optimum-value
+
::-webkit-meter-optimum-value

Specifications

@@ -29,11 +29,11 @@

Examples

HTML

-
<meter min="0" max="10" value="6">Score out of 10</meter>
+
<meter min="0" max="10" value="6">Score out of 10</meter>

CSS

-
meter::-webkit-meter-bar {
+
meter::-webkit-meter-bar {
   /* Required to get rid of the default background property */
   background : none;
   background-color : whiteSmoke;
diff --git a/files/en-us/web/css/_doublecolon_-webkit-meter-suboptimum-value/index.html b/files/en-us/web/css/_doublecolon_-webkit-meter-suboptimum-value/index.html
index 07f9da97d5dce43..bd2577019e6866c 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-meter-suboptimum-value/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-meter-suboptimum-value/index.html
@@ -15,7 +15,7 @@
 
 

Syntax

-
::-webkit-meter-suboptimum-value
+
::-webkit-meter-suboptimum-value

Examples

@@ -23,11 +23,11 @@

Examples

HTML

-
<meter min="0" max="10" value="6">Score out of 10</meter>
+
<meter min="0" max="10" value="6">Score out of 10</meter>

CSS

-
meter::-webkit-meter-suboptimum-value {
+
meter::-webkit-meter-suboptimum-value {
   background: -webkit-gradient linear, left top, left bottom;
   height: 100%;
   box-sizing: border-box;
diff --git a/files/en-us/web/css/_doublecolon_-webkit-outer-spin-button/index.html b/files/en-us/web/css/_doublecolon_-webkit-outer-spin-button/index.html
index 857fda02dba6f01..264cd0a622c4bb0 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-outer-spin-button/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-outer-spin-button/index.html
@@ -14,7 +14,7 @@
 
 

Syntax

-
::-webkit-outer-spin-button
+
::-webkit-outer-spin-button

Examples

@@ -28,12 +28,12 @@

Hiding the spinner

HTML

-
<input type="number">
+
<input type="number">
 

CSS

-
input::-webkit-outer-spin-button {
+
input::-webkit-outer-spin-button {
   -webkit-appearance: none;
 }
diff --git a/files/en-us/web/css/_doublecolon_-webkit-progress-bar/index.html b/files/en-us/web/css/_doublecolon_-webkit-progress-bar/index.html index 6b155131944c6f0..bdb634ccda676a1 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-progress-bar/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-progress-bar/index.html @@ -18,13 +18,13 @@

Syntax

-
::-webkit-progress-bar
+
::-webkit-progress-bar

Examples

CSS content

-
progress {
+
progress {
   -webkit-appearance: none;
 }
 
@@ -35,7 +35,7 @@ 

CSS content

HTML content

-
<progress value="10" max="50">
+
<progress value="10" max="50">
 

Result

diff --git a/files/en-us/web/css/_doublecolon_-webkit-progress-inner-element/index.html b/files/en-us/web/css/_doublecolon_-webkit-progress-inner-element/index.html index fa6f14674ea31f8..4fcfb477ce647fe 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-progress-inner-element/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-progress-inner-element/index.html @@ -18,7 +18,7 @@

Syntax

-
::-webkit-progress-inner-element
+
::-webkit-progress-inner-element

Examples

@@ -30,12 +30,12 @@

Adding a black border aro

HTML

-
<progress value="10" max="50">
+
<progress value="10" max="50">
 

CSS

-
progress {
+
progress {
   -webkit-appearance: none;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_-webkit-progress-value/index.html b/files/en-us/web/css/_doublecolon_-webkit-progress-value/index.html
index 725872dc49804a5..0e9cdb2d7a95aa5 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-progress-value/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-progress-value/index.html
@@ -18,7 +18,7 @@
 
 

Syntax

-
::-webkit-progress-value
+
::-webkit-progress-value

Examples

@@ -26,12 +26,12 @@

Examples

HTML

-
<progress value="10" max="50">
+
<progress value="10" max="50">
 

CSS

-
progress {
+
progress {
   -webkit-appearance: none;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_-webkit-scrollbar/index.html b/files/en-us/web/css/_doublecolon_-webkit-scrollbar/index.html
index beced751b39e944..ac17df3df7dc9d6 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-scrollbar/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-scrollbar/index.html
@@ -36,13 +36,13 @@ 

CSS Scrollbar Selectors

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

CSS

-
.visible-scrollbar, .invisible-scrollbar, .mostly-customized-scrollbar {
+
.visible-scrollbar, .invisible-scrollbar, .mostly-customized-scrollbar {
   display: block;
   width: 10em;
   overflow: auto;
@@ -69,7 +69,7 @@ 

CSS

HTML

-
<div class="visible-scrollbar">
+
<div class="visible-scrollbar">
   Etiam sagittis sem sed lacus laoreet, eu fermentum eros auctor.
   Proin at nulla elementum, consectetur ex eget, commodo ante.
   Sed eros mi, bibendum ut dignissim et, maximus eget nibh. Phasellus
diff --git a/files/en-us/web/css/_doublecolon_-webkit-search-cancel-button/index.html b/files/en-us/web/css/_doublecolon_-webkit-search-cancel-button/index.html
index f0dc4def9b7a85f..a9ccb3827dc9596 100644
--- a/files/en-us/web/css/_doublecolon_-webkit-search-cancel-button/index.html
+++ b/files/en-us/web/css/_doublecolon_-webkit-search-cancel-button/index.html
@@ -15,7 +15,7 @@
 
 

Syntax

-
 selector::-webkit-search-cancel-button
+
 selector::-webkit-search-cancel-button

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-webkit-search-results-button/index.html b/files/en-us/web/css/_doublecolon_-webkit-search-results-button/index.html index df9f1e2ccfdb712..c3d50baa6a2b7e8 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-search-results-button/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-search-results-button/index.html @@ -15,7 +15,7 @@

Syntax

-
 selector::-webkit-search-results-button
+
 selector::-webkit-search-results-button

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-webkit-slider-runnable-track/index.html b/files/en-us/web/css/_doublecolon_-webkit-slider-runnable-track/index.html index 8fc7ee876b062f0..7436c422c711b51 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-slider-runnable-track/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-slider-runnable-track/index.html @@ -19,7 +19,7 @@

Syntax

-
::-webkit-slider-runnable-track
+
::-webkit-slider-runnable-track

Specifications

diff --git a/files/en-us/web/css/_doublecolon_-webkit-slider-thumb/index.html b/files/en-us/web/css/_doublecolon_-webkit-slider-thumb/index.html index a0bbc07b9a7f705..55245ba3a58b3eb 100644 --- a/files/en-us/web/css/_doublecolon_-webkit-slider-thumb/index.html +++ b/files/en-us/web/css/_doublecolon_-webkit-slider-thumb/index.html @@ -18,7 +18,7 @@

Syntax

-
::-webkit-slider-thumb
+
::-webkit-slider-thumb

Specifications

diff --git a/files/en-us/web/css/_doublecolon_after/index.html b/files/en-us/web/css/_doublecolon_after/index.html index 99eda8274df49d1..d90a0b602758e93 100644 --- a/files/en-us/web/css/_doublecolon_after/index.html +++ b/files/en-us/web/css/_doublecolon_after/index.html @@ -13,7 +13,7 @@

In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the {{CSSxRef("content")}} property. It is inline by default.

-
/* Add an arrow after links */
+
/* Add an arrow after links */
 a::after {
   content: "→";
 }
@@ -24,7 +24,7 @@

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Note: CSS3 introduced the ::after notation (with two colons) to distinguish pseudo-classes from pseudo-elements. Browsers also accept :after, introduced in CSS2.

@@ -38,13 +38,13 @@

Simple usage

HTML

-
<p class="boring-text">Here is some plain old boring text.</p>
+
<p class="boring-text">Here is some plain old boring text.</p>
 <p>Here is some normal text that is neither boring nor exciting.</p>
 <p class="exciting-text">Contributing to MDN is easy and fun.</p>

CSS

-
.exciting-text::after {
+
.exciting-text::after {
   content: " <- EXCITING!";
   color: green;
 }
@@ -64,11 +64,11 @@ 

Decorative example

HTML

-
<span class="ribbon">Look at the orange box after this text. </span>
+
<span class="ribbon">Look at the orange box after this text. </span>

CSS

-
.ribbon {
+
.ribbon {
   background-color: #5BC8F7;
 }
 
@@ -91,7 +91,7 @@ 

Tooltips

HTML

-
<p>Here we have some
+
<p>Here we have some
   <span tabindex="0" data-descr="collection of words and punctuation">text</span> with a few
   <span tabindex="0" data-descr="small popups that appear when hovering">tooltips</span>.
 </p>
@@ -99,7 +99,7 @@ 

HTML

CSS

-
span[data-descr] {
+
span[data-descr] {
   position: relative;
   text-decoration: underline;
   color: #00F;
diff --git a/files/en-us/web/css/_doublecolon_backdrop/index.html b/files/en-us/web/css/_doublecolon_backdrop/index.html
index 5c2f8159c5643f6..e459021b7774dcf 100644
--- a/files/en-us/web/css/_doublecolon_backdrop/index.html
+++ b/files/en-us/web/css/_doublecolon_backdrop/index.html
@@ -20,7 +20,7 @@
 
 

When multiple elements have been placed into full-screen mode, the backdrop is drawn immediately beneath the frontmost such element, and on top of the older full-screen elements.

-
/* Backdrop is only displayed when dialog is opened with dialog.showModal() */
+
/* Backdrop is only displayed when dialog is opened with dialog.showModal() */
 dialog::backdrop {
   background: rgba(255,0,0,.25);
 }
@@ -31,7 +31,7 @@

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

@@ -39,7 +39,7 @@

Styling the backdrop for ful

In this example, the backdrop style used when a video is shifted to full-screen mode is configured to be a grey-blue color rather than the black it defaults to in most browsers.

-
video::backdrop {
+
video::backdrop {
   background-color: #448;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_before/index.html b/files/en-us/web/css/_doublecolon_before/index.html index aae17123f89cbb2..bbf16695dafb88e 100644 --- a/files/en-us/web/css/_doublecolon_before/index.html +++ b/files/en-us/web/css/_doublecolon_before/index.html @@ -13,7 +13,7 @@

In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the {{cssxref("content")}} property. It is inline by default.

-
/* Add a heart before links */
+
/* Add a heart before links */
 a::before {
   content: "♥";
 }
@@ -24,7 +24,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Note: CSS3 introduced the ::before notation (with two colons) to distinguish pseudo-classes from pseudo-elements. Browsers also accept :before, introduced in CSS2.

@@ -38,11 +38,11 @@

Adding quotation marks

HTML

-
<q>Some quotes</q>, he said, <q>are better than none.</q>
+
<q>Some quotes</q>, he said, <q>are better than none.</q>

CSS

-
q::before {
+
q::before {
   content: "«";
   color: blue;
 }
@@ -62,11 +62,11 @@ 

Decorative example

HTML

-
<span class="ribbon">Notice where the orange box is.</span>
+
<span class="ribbon">Notice where the orange box is.</span>

CSS

-
.ribbon {
+
.ribbon {
   background-color: #5BC8F7;
 }
 
@@ -87,7 +87,7 @@ 

To-do list

HTML

-
<ul>
+
<ul>
   <li>Buy milk</li>
   <li>Take the dog for a walk</li>
   <li>Exercise</li>
@@ -99,7 +99,7 @@ 

HTML

CSS

-
li {
+
li {
   list-style-type: none;
   position: relative;
   margin: 2px;
@@ -128,7 +128,7 @@ 

CSS

JavaScript

-
var list = document.querySelector('ul');
+
var list = document.querySelector('ul');
 list.addEventListener('click', function(ev) {
   if (ev.target.tagName === 'LI') {
      ev.target.classList.toggle('done');
@@ -148,7 +148,7 @@ 

Special characters

HTML

-
<ol>
+
<ol>
   <li>Crack Eggs into bowl</li>
   <li>Add Milk</li>
   <li>Add Flour</li>
@@ -162,7 +162,7 @@ 

HTML

CSS

-
li {
+
li {
   padding:0.5em;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_cue-region/index.html b/files/en-us/web/css/_doublecolon_cue-region/index.html
index 869db3fd3458f7b..7e76f920982eaf5 100644
--- a/files/en-us/web/css/_doublecolon_cue-region/index.html
+++ b/files/en-us/web/css/_doublecolon_cue-region/index.html
@@ -15,7 +15,7 @@
 
 

The ::cue-region CSS pseudo-element matches {{DOMxRef("WebVTT API", "WebVTT", "", 1)}} cues within a selected element. This can be used to style captions and other cues in media with VTT tracks.

-
::cue-region {
+
::cue-region {
   color: yellow;
   font-weight: bold;
 }
@@ -24,7 +24,7 @@

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Permitted properties

diff --git a/files/en-us/web/css/_doublecolon_cue/index.html b/files/en-us/web/css/_doublecolon_cue/index.html index 09775e3fabbdc09..159e935869a5a7d 100644 --- a/files/en-us/web/css/_doublecolon_cue/index.html +++ b/files/en-us/web/css/_doublecolon_cue/index.html @@ -16,7 +16,7 @@

The ::cue CSS pseudo-element matches WebVTT cues within a selected element. This can be used to style captions and other cues in media with VTT tracks.

-
::cue {
+
::cue {
   color: yellow;
   font-weight: bold;
 }
@@ -25,7 +25,7 @@

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Permitted properties

@@ -73,7 +73,7 @@

Styling WebVTT cues as white-on-b

The following CSS sets the cue style so that the text is white and the background is a translucent black box.

-
::cue {
+
::cue {
   color: #fff;
   background-color: rgba(0, 0, 0, 0.6);
 }
diff --git a/files/en-us/web/css/_doublecolon_file-selector-button/index.html b/files/en-us/web/css/_doublecolon_file-selector-button/index.html index c0124c1d48876c9..b360ef9b7eecf30 100644 --- a/files/en-us/web/css/_doublecolon_file-selector-button/index.html +++ b/files/en-us/web/css/_doublecolon_file-selector-button/index.html @@ -19,7 +19,7 @@

Syntax

-
selector::file-selector-button
+
selector::file-selector-button
 

Examples

@@ -27,7 +27,7 @@

Examples

HTML

-
<form>
+
<form>
   <label for="fileUpload">Upload file</label>
   <input type="file" id="fileUpload">
 </form>
@@ -35,7 +35,7 @@

HTML

CSS

-
input[type=file]::file-selector-button {
+
input[type=file]::file-selector-button {
   border: 2px solid #6c5ce7;
   padding: .2em .4em;
   border-radius: .2em;
@@ -67,7 +67,7 @@ 

CSS

HTML

-
<form>
+
<form>
   <label for="fileUpload">Upload file</label>
   <input type="file" id="fileUpload">
 </form>
@@ -75,7 +75,7 @@

HTML

CSS

-
input[type=file]::-webkit-file-upload-button {
+
input[type=file]::-webkit-file-upload-button {
   border: 2px solid #6c5ce7;
   padding: .2em .4em;
   border-radius: .2em;
diff --git a/files/en-us/web/css/_doublecolon_first-letter/index.html b/files/en-us/web/css/_doublecolon_first-letter/index.html
index f0a6a17d4b61813..ebe0efa4c2ec8d2 100644
--- a/files/en-us/web/css/_doublecolon_first-letter/index.html
+++ b/files/en-us/web/css/_doublecolon_first-letter/index.html
@@ -12,7 +12,7 @@
 
 

The ::first-letter CSS pseudo-element applies styles to the first letter of the first line of a block-level element, but only when not preceded by other content (such as images or inline tables).

-
/* Selects the first letter of a <p> */
+
/* Selects the first letter of a <p> */
 p::first-letter {
   font-size: 130%;
 }
@@ -45,7 +45,7 @@

Allowable properties

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -55,7 +55,7 @@

Simple drop cap

HTML

-
<h2>My heading</h2>
+
<h2>My heading</h2>
 <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt
   ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
   dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est.</p>
@@ -63,7 +63,7 @@ 

HTML

CSS

-
p {
+
p {
   width: 500px;
   line-height: 1.5;
 }
@@ -89,7 +89,7 @@ 

Effect on specia

HTML

-
<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.</p>
+
<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.</p>
 <p>-The beginning of a special punctuation mark.</p>
 <p>_The beginning of a special punctuation mark.</p>
 <p>"The beginning of a special punctuation mark.</p>
@@ -102,7 +102,7 @@ 

HTML

CSS

-
p::first-letter {
+
p::first-letter {
   color: red;
   font-size: 150%;
 }
diff --git a/files/en-us/web/css/_doublecolon_first-line/index.html b/files/en-us/web/css/_doublecolon_first-line/index.html index 385285925ff0032..bf99c576519ea3f 100644 --- a/files/en-us/web/css/_doublecolon_first-line/index.html +++ b/files/en-us/web/css/_doublecolon_first-line/index.html @@ -12,7 +12,7 @@

The ::first-line CSS pseudo-element applies styles to the first line of a block-level element. Note that the length of the first line depends on many factors, including the width of the element, the width of the document, and the font size of the text.

-
/* Selects the first line of a <p> */
+
/* Selects the first line of a <p> */
 p::first-line {
   color: red;
 }
@@ -35,13 +35,13 @@

Allowable properties

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

HTML

-
<p>Styles will only be applied to the first line of this paragraph.
+
<p>Styles will only be applied to the first line of this paragraph.
 After that, all text will be styled like normal. See what I mean?</p>
 
 <span>The first line of this text will not receive special styling
@@ -49,7 +49,7 @@ 

HTML

CSS

-
::first-line {
+
::first-line {
   color: blue;
   text-transform: uppercase;
 
diff --git a/files/en-us/web/css/_doublecolon_grammar-error/index.html b/files/en-us/web/css/_doublecolon_grammar-error/index.html
index 6e23d5fdf42bc9e..634cef698b9cc5d 100644
--- a/files/en-us/web/css/_doublecolon_grammar-error/index.html
+++ b/files/en-us/web/css/_doublecolon_grammar-error/index.html
@@ -29,7 +29,7 @@ 

Allowable properties

Syntax

-
::grammar-error
+
::grammar-error

Examples

@@ -39,11 +39,11 @@

Simple document grammar check

HTML

-
<p>My friends is coming to the party tonight.</p>
+
<p>My friends is coming to the party tonight.</p>

CSS

-
::grammar-error  {
+
::grammar-error  {
   text-decoration: underline red;
   color: red;
 }
diff --git a/files/en-us/web/css/_doublecolon_marker/index.html b/files/en-us/web/css/_doublecolon_marker/index.html index f7c2f5f8238e84a..2857faf08b782b9 100644 --- a/files/en-us/web/css/_doublecolon_marker/index.html +++ b/files/en-us/web/css/_doublecolon_marker/index.html @@ -14,7 +14,7 @@

The ::marker CSS pseudo-element selects the marker box of a list item, which typically contains a bullet or number. It works on any element or pseudo-element set to display: list-item, such as the {{HTMLElement("li")}} and {{HTMLElement("summary")}} elements.

-
::marker {
+
::marker {
   color: blue;
   font-size: 1.2em;
 }
@@ -38,13 +38,13 @@

Allowable properties

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

HTML

-
<ul>
+
<ul>
   <li>Peaches</li>
   <li>Apples</li>
   <li>Plums</li>
@@ -52,7 +52,7 @@ 

HTML

CSS

-
ul li::marker {
+
ul li::marker {
   color: red;
   font-size: 1.5em;
 }
diff --git a/files/en-us/web/css/_doublecolon_part/index.html b/files/en-us/web/css/_doublecolon_part/index.html index be256c49267ff04..14109fe46cc9c69 100644 --- a/files/en-us/web/css/_doublecolon_part/index.html +++ b/files/en-us/web/css/_doublecolon_part/index.html @@ -16,20 +16,20 @@

The ::part CSS pseudo-element represents any element within a shadow tree that has a matching {{HTMLAttrxRef("part")}} attribute.

-
custom-element::part(foo) {
+
custom-element::part(foo) {
   /* Styles to apply to the `foo` part */
 }
 

Syntax

-
{{CSSSyntax}}
+
{{CSSSyntax}}

Examples

HTML

-
<template id="tabbed-custom-element">
+
<template id="tabbed-custom-element">
 <style type="text/css">
 *, ::before, ::after {
   box-sizing: border-box;
@@ -48,7 +48,7 @@ 

HTML

CSS

-
tabbed-custom-element::part(tab) {
+
tabbed-custom-element::part(tab) {
   color: #0c0dcc;
   border-bottom: transparent solid 2px;
 }
@@ -77,7 +77,7 @@ 

CSS

JavaScript

-
let template = document.querySelector("#tabbed-custom-element");
+
let template = document.querySelector("#tabbed-custom-element");
 globalThis.customElements.define(template.id, class extends HTMLElement {
   constructor() {
     super();
diff --git a/files/en-us/web/css/_doublecolon_placeholder/index.html b/files/en-us/web/css/_doublecolon_placeholder/index.html
index b54674e4a6b634d..505f6c804e75dc2 100644
--- a/files/en-us/web/css/_doublecolon_placeholder/index.html
+++ b/files/en-us/web/css/_doublecolon_placeholder/index.html
@@ -12,7 +12,7 @@
 
 

The ::placeholder CSS pseudo-element represents the placeholder text in an {{HTMLElement("input")}} or {{HTMLElement("textarea")}} element.

-
::placeholder {
+
::placeholder {
   color: blue;
   font-size: 1.5em;
 }
@@ -25,7 +25,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Accessibility concerns

@@ -53,7 +53,7 @@

Usability

With this implementation, the hint content is available even if information is entered into the input field, and the input appears free of preexisting input when the page is loaded. Most screen reading technology will use aria-describedby to read the hint after the input's label text is announced, and the person using the screen reader can mute it if they find the extra information unnecessary.

-
<label for="user-email">Your email address</label>
+
<label for="user-email">Your email address</label>
 <span id="user-email-hint" class="input-hint">Example: jane@sample.com</span>
 <input id="user-email" aria-describedby="user-email-hint" name="email" type="email">
 
@@ -87,11 +87,11 @@

Change placeholder appearance

HTML

-
<input placeholder="Type here...">
+
<input placeholder="Type here...">

CSS

-
input::placeholder {
+
input::placeholder {
   color: red;
   font-size: 1.2em;
   font-style: italic;
@@ -107,13 +107,13 @@ 

Opaque text

HTML

-
<input placeholder="Default opacity...">
+
<input placeholder="Default opacity...">
 <input placeholder="Full opacity..." class="force-opaque">
 

CSS

-
::placeholder {
+
::placeholder {
   color: green;
 }
 
diff --git a/files/en-us/web/css/_doublecolon_selection/index.html b/files/en-us/web/css/_doublecolon_selection/index.html
index edebbca19a147b2..caa76a1acfc4f81 100644
--- a/files/en-us/web/css/_doublecolon_selection/index.html
+++ b/files/en-us/web/css/_doublecolon_selection/index.html
@@ -12,7 +12,7 @@
 
 

The ::selection CSS pseudo-element applies styles to the part of a document that has been highlighted by the user (such as clicking and dragging the mouse across text).

-
::selection {
+
::selection {
   background-color: cyan;
 }
@@ -37,7 +37,7 @@

Allowable properties

Syntax

-
/* Legacy Firefox syntax (version 61 and below) */
+
/* Legacy Firefox syntax (version 61 and below) */
 ::-moz-selection
 
 {{CSSSyntax}}
@@ -47,13 +47,13 @@ 

Examples

HTML

-
This text has special styles when you highlight it.
+
This text has special styles when you highlight it.
 <p>Also try selecting text in this paragraph.</p>

CSS

-
/* Make selected text gold on a red background */
+
/* Make selected text gold on a red background */
 ::selection {
   color: gold;
   background-color: red;
diff --git a/files/en-us/web/css/_doublecolon_slotted/index.html b/files/en-us/web/css/_doublecolon_slotted/index.html
index 2e15a7aee58534f..f9a660e29b02111 100644
--- a/files/en-us/web/css/_doublecolon_slotted/index.html
+++ b/files/en-us/web/css/_doublecolon_slotted/index.html
@@ -16,7 +16,7 @@
 
 

This only works when used inside CSS placed within a shadow DOM. Note also that this selector won't select a text node placed into a slot; it only targets actual elements.

-
/* Selects any element placed inside a slot */
+
/* Selects any element placed inside a slot */
 ::slotted(*) {
   font-weight: bold;
 }
@@ -29,7 +29,7 @@
 
 

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

@@ -39,7 +39,7 @@

Highlighting slotted elements

In this demo we use a simple template with three slots:

-
<template id="person-template">
+
<template id="person-template">
   <div>
     <h2>Personal ID Card</h2>
     <slot name="person-name">NAME MISSING</slot>
@@ -52,7 +52,7 @@ 

Highlighting slotted elements

A custom element — <person-details> — is defined like so:

-
customElements.define('person-details',
+
customElements.define('person-details',
   class extends HTMLElement {
     constructor() {
       super();
@@ -77,7 +77,7 @@ 

Highlighting slotted elements

The element looks like this when inserted into the page:

-
<person-details>
+
<person-details>
   <p slot="person-name">Dr. Shazaam</p>
   <span slot="person-age">Immortal</span>
   <span slot="person-occupation">Superhero</span>
diff --git a/files/en-us/web/css/_doublecolon_spelling-error/index.html b/files/en-us/web/css/_doublecolon_spelling-error/index.html
index 0851f2b4bfe658e..6264bd5e941ffeb 100644
--- a/files/en-us/web/css/_doublecolon_spelling-error/index.html
+++ b/files/en-us/web/css/_doublecolon_spelling-error/index.html
@@ -30,7 +30,7 @@ 

Allowable properties

Syntax

-
::spelling-error
+
::spelling-error

Examples

@@ -40,11 +40,11 @@

Simple document spell check

HTML

-
<p contenteditable spellcheck="true">My friends are coegdfgfddffbgning to the party tonight.</p>
+
<p contenteditable spellcheck="true">My friends are coegdfgfddffbgning to the party tonight.</p>

CSS

-
::spelling-error  {
+
::spelling-error  {
   text-decoration: wavy red;
 }
diff --git a/files/en-us/web/css/_doublecolon_target-text/index.html b/files/en-us/web/css/_doublecolon_target-text/index.html index fbf09f7000e6a80..43829144ccc66ea 100644 --- a/files/en-us/web/css/_doublecolon_target-text/index.html +++ b/files/en-us/web/css/_doublecolon_target-text/index.html @@ -19,7 +19,7 @@

Syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

diff --git a/files/en-us/web/css/adjacent_sibling_combinator/index.html b/files/en-us/web/css/adjacent_sibling_combinator/index.html index 8b184dddf807f5a..8c50a2f9a6e3070 100644 --- a/files/en-us/web/css/adjacent_sibling_combinator/index.html +++ b/files/en-us/web/css/adjacent_sibling_combinator/index.html @@ -12,28 +12,28 @@

The adjacent sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent {{DOMxRef("element")}}.

-
/* Paragraphs that come immediately after any image */
+
/* Paragraphs that come immediately after any image */
 img + p {
   font-weight: bold;
 }

Syntax

-
former_element + target_element { style properties }
+
former_element + target_element { style properties }
 

Examples

CSS

-
li:first-of-type + li {
+
li:first-of-type + li {
   color: red;
 }
 

HTML

-
<ul>
+
<ul>
   <li>One</li>
   <li>Two!</li>
   <li>Three</li>
diff --git a/files/en-us/web/css/align-content/index.html b/files/en-us/web/css/align-content/index.html
index a1dabc78f0a666c..5a2c81a5bfc278f 100644
--- a/files/en-us/web/css/align-content/index.html
+++ b/files/en-us/web/css/align-content/index.html
@@ -18,7 +18,7 @@
 
 

Syntax

-
/* Basic positional alignment */
+
/* Basic positional alignment */
 /* align-content does not take left and right values */
 align-content: center;     /* Pack items around the center */
 align-content: start;      /* Pack items from the start */
@@ -100,13 +100,13 @@ 

Formal definition

Formal syntax

-
{{csssyntax}}
+
{{csssyntax}}

Examples

CSS

-
#container {
+
#container {
   height:200px;
   width: 240px;
   align-content: center; /* Can be changed in the live sample */
@@ -174,7 +174,7 @@ 

CSS

HTML

-
<div id="container" class="flex">
+
<div id="container" class="flex">
   <div id="item1">1</div>
   <div id="item2">2</div>
   <div id="item3">3</div>
@@ -227,7 +227,7 @@ 

HTML