Skip to content

Instantly share code, notes, and snippets.

@beausmith

beausmith/webkit-pseudo-elements.md

Forked from bbbrrriiiaaannn/webkit-pseudo-elements.md
Created April 10, 2013 18:46
Show Gist options
  • Save beausmith/5357332 to your computer and use it in GitHub Desktop.
Save beausmith/5357332 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @bbbrrriiiaaannn bbbrrriiiaaannn revised this gist Jan 22, 2013. 1 changed file with 7 additions and 4 deletions.
    11 changes: 7 additions & 4 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -246,7 +246,10 @@ Scrollbar

    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    --------------------------------------------------------------------
    ::-webkit-textfield-decoration-container
    ::-webkit-image-inner-element
    ::-webkit-media-controls-panel
    ::-webkit-media-controls-timeline-container
    `::-webkit-textfield-decoration-container`

    `::-webkit-image-inner-element`

    `::-webkit-media-controls-panel`

    `::-webkit-media-controls-timeline-container`
  2. @bbbrrriiiaaannn bbbrrriiiaaannn revised this gist Jan 22, 2013. 1 changed file with 64 additions and 231 deletions.
    295 changes: 64 additions & 231 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,17 +1,9 @@
    A fork of updates to @afabbro's tremendous original reference document.



    An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk.

    Everything is broken up by tag, but within each the selectors aren't particularly ordered.

    I have not tested/verified all of these. Have I missed some or got it wrong? Let me know. - A
    Some updates to [Angelina Fabbro](https://gist.github.com/afabbro)'s tremendous original reference document. The most notable additions are shadow pseudoclasses for scroller pseudoelements.

    A friendly reminder that you may need to set this property on your target/selected element to get the styling results you want:

    `-webkit-appearance:none;`


    <video>
    -------------

    @@ -87,7 +79,7 @@ A friendly reminder that you may need to set this property on your target/select

    ```
    input[type="range"]::-webkit-slider-thumb`
    :disabled`
    :disabled
    :hover
    ```

    @@ -184,231 +176,72 @@ Search
    Scrollbar
    ---------

    `::-webkit-scrollbar`

    `::-webkit-scrollbar:horizontal`

    `::-webkit-scrollbar:horizontal:corner-present`

    `::-webkit-scrollbar:horizontal:window-inactive`

    `::-webkit-scrollbar:vertical`

    `::-webkit-scrollbar:vertical:corner-present`

    `::-webkit-scrollbar:vertical:window-inactive`

    `::-webkit-scrollbar-button`

    `::-webkit-scrollbar-button:disabled`

    `::-webkit-scrollbar-button:double-button:horizontal:end:decrement`

    `::-webkit-scrollbar-button:double-button:horizontal:end:increment`

    `::-webkit-scrollbar-button:double-button:horizontal:end:increment:corner-present`

    `::-webkit-scrollbar-button:double-button:horizontal:start:decrement`

    `::-webkit-scrollbar-button:double-button:horizontal:start:increment`

    `::-webkit-scrollbar-button:double-button:vertical:end:decrement`

    `::-webkit-scrollbar-button:double-button:vertical:end:increment`

    `::-webkit-scrollbar-button:double-button:vertical:end:increment:corner-present`

    `::-webkit-scrollbar-button:double-button:vertical:start:decrement`

    `::-webkit-scrollbar-button:double-button:vertical:start:increment`

    `::-webkit-scrollbar-button:end`

    `::-webkit-scrollbar-button:end:decrement`

    `::-webkit-scrollbar-button:end:increment`

    `::-webkit-scrollbar-button:horizontal`

    `::-webkit-scrollbar-button:horizontal:decrement`

    `::-webkit-scrollbar-button:horizontal:decrement:active`

    `::-webkit-scrollbar-button:horizontal:decrement:hover`

    `::-webkit-scrollbar-button:horizontal:decrement:window-inactive`

    `::-webkit-scrollbar-button:horizontal:end`

    `::-webkit-scrollbar-button:horizontal:end:decrement`

    `::-webkit-scrollbar-button:horizontal:end:increment`

    `::-webkit-scrollbar-button:horizontal:end:increment:corner-present`

    `::-webkit-scrollbar-button:horizontal:increment`

    `::-webkit-scrollbar-button:horizontal:increment:active`

    `::-webkit-scrollbar-button:horizontal:increment:hover`

    `::-webkit-scrollbar-button:horizontal:increment:window-inactive`

    `::-webkit-scrollbar-button:horizontal:start`

    `::-webkit-scrollbar-button:horizontal:start:decrement`

    `::-webkit-scrollbar-button:horizontal:start:increment`

    `::-webkit-scrollbar-button:start`

    `::-webkit-scrollbar-button:start:decrement`

    `::-webkit-scrollbar-button:start:increment`

    `::-webkit-scrollbar-button:vertical`

    `::-webkit-scrollbar-button:vertical:decrement`

    `::-webkit-scrollbar-button:vertical:decrement:active`

    `::-webkit-scrollbar-button:vertical:decrement:hover`

    `::-webkit-scrollbar-button:vertical:decrement:window-inactive`

    `::-webkit-scrollbar-button:vertical:end`

    `::-webkit-scrollbar-button:vertical:end:decrement`

    `::-webkit-scrollbar-button:vertical:end:increment`

    `::-webkit-scrollbar-button:vertical:end:increment:corner-present`

    `::-webkit-scrollbar-button:vertical:increment`

    `::-webkit-scrollbar-button:vertical:increment:active`

    `::-webkit-scrollbar-button:vertical:increment:hover`

    `::-webkit-scrollbar-button:vertical:increment:window-inactive`

    `::-webkit-scrollbar-button:vertical:start`

    `::-webkit-scrollbar-button:vertical:start:decrement`

    `::-webkit-scrollbar-button:vertical:start:increment`

    `::-webkit-scrollbar-corner`

    `::-webkit-scrollbar-corner:window-inactive`

    `::-webkit-scrollbar-thumb`

    `::-webkit-scrollbar-thumb:horizontal`

    `::-webkit-scrollbar-thumb:horizontal:active`

    `::-webkit-scrollbar-thumb:horizontal:hover`

    `::-webkit-scrollbar-thumb:horizontal:window-inactive`

    `::-webkit-scrollbar-thumb:vertical`

    `::-webkit-scrollbar-thumb:vertical:active`

    `::-webkit-scrollbar-thumb:vertical:hover`

    `::-webkit-scrollbar-thumb:vertical:window-inactive`

    `::-webkit-scrollbar-track`

    `::-webkit-scrollbar-track:disabled`

    `::-webkit-scrollbar-track:horizontal`

    `::-webkit-scrollbar-track:horizontal:disabled`

    `::-webkit-scrollbar-track:horizontal:disabled:corner-present`

    `::-webkit-scrollbar-track:vertical:disabled`

    `::-webkit-scrollbar-track:vertical:disabled:corner-present`

    `::-webkit-scrollbar-track-piece`

    `::-webkit-scrollbar-track-piece:disabled`

    `::-webkit-scrollbar-track-piece:end`

    `::-webkit-scrollbar-track-piece:horizontal:decrement`

    `::-webkit-scrollbar-track-piece:horizontal:decrement:active`

    `::-webkit-scrollbar-track-piece:horizontal:decrement:hover`

    `::-webkit-scrollbar-track-piece:horizontal:end`

    `::-webkit-scrollbar-track-piece:horizontal:end:corner-present`

    `::-webkit-scrollbar-track-piece:horizontal:end:double-button`

    `::-webkit-scrollbar-track-piece:horizontal:end:no-button`

    `::-webkit-scrollbar-track-piece:horizontal:end:no-button:corner-present`

    `::-webkit-scrollbar-track-piece:horizontal:end:single-button`

    `::-webkit-scrollbar-track-piece:horizontal:increment`

    `::-webkit-scrollbar-track-piece:horizontal:increment:active`

    `::-webkit-scrollbar-track-piece:horizontal:increment:hover`

    `::-webkit-scrollbar-track-piece:horizontal:start`

    `::-webkit-scrollbar-track-piece:horizontal:start:double-button`

    `::-webkit-scrollbar-track-piece:horizontal:start:no-button`

    `::-webkit-scrollbar-track-piece:horizontal:start:single-button`

    `::-webkit-scrollbar-track-piece:start`

    `::-webkit-scrollbar-track-piece:vertical:decrement`

    `::-webkit-scrollbar-track-piece:vertical:decrement:active`

    `::-webkit-scrollbar-track-piece:vertical:decrement:hover`

    `::-webkit-scrollbar-track-piece:vertical:end`

    `::-webkit-scrollbar-track-piece:vertical:end:corner-present`

    `::-webkit-scrollbar-track-piece:vertical:end:double-button`

    `::-webkit-scrollbar-track-piece:vertical:end:no-button`

    `::-webkit-scrollbar-track-piece:vertical:end:no-button:corner-present`

    `::-webkit-scrollbar-track-piece:vertical:end:single-button`

    `::-webkit-scrollbar-track-piece:vertical:increment`

    `::-webkit-scrollbar-track-piece:vertical:increment:active`

    `::-webkit-scrollbar-track-piece:vertical:increment:hover`

    `::-webkit-scrollbar-track-piece:vertical:start`
    ```
    ::-webkit-scrollbar
    :horizontal
    :vertical
    :corner-present
    :window-inactive
    ```

    `::-webkit-scrollbar-track-piece:vertical:start:double-button`
    ```
    ::-webkit-scrollbar-button
    :disabled
    :double-button
    :horizontal
    :vertical
    :corner-present
    :start
    :end
    :decrement
    :increment
    :active
    :hover
    :window-inactive
    ```
    ```
    ::-webkit-scrollbar-corner
    :window-inactive
    ```

    `::-webkit-scrollbar-track-piece:vertical:start:no-button`
    ```
    ::-webkit-scrollbar-thumb
    :horizontal
    :vertical
    :active
    :hover
    :window-inactive
    ```

    `::-webkit-scrollbar-track-piece:vertical:start:single-button`
    ```
    ::-webkit-scrollbar-track
    :disabled
    :horizontal
    :vertical
    :corner-present
    ```

    `::-webkit-resizer`
    ```
    ::-webkit-scrollbar-track-piece
    :disabled
    :start
    :end
    :horizontal
    :vertical
    :corner-present
    :decrement
    :increment
    :active
    :hover
    :no-button
    :single-button
    :double-button
    ```

    `::-webkit-resizer:window-inactive`
    ```
    ::-webkit-resizer
    :window-inactive
    ```


    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
  3. @bbbrrriiiaaannn bbbrrriiiaaannn revised this gist Jan 22, 2013. 1 changed file with 9 additions and 12 deletions.
    21 changes: 9 additions & 12 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -85,11 +85,11 @@ A friendly reminder that you may need to set this property on your target/select
    <input type="range">
    -------------------

    `input[type="range"]::-webkit-slider-thumb`

    ` :disabled`

    ` :hover`
    ```
    input[type="range"]::-webkit-slider-thumb`
    :disabled`
    :hover
    ```

    `input[type="range"]::-webkit-slider-container`

    @@ -413,10 +413,7 @@ Scrollbar

    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    --------------------------------------------------------------------
    `::-webkit-textfield-decoration-container`

    `::-webkit-image-inner-element`

    `::-webkit-media-controls-panel`

    `::-webkit-media-controls-timeline-container`
    ::-webkit-textfield-decoration-container
    ::-webkit-image-inner-element
    ::-webkit-media-controls-panel
    ::-webkit-media-controls-timeline-container
  4. @bbbrrriiiaaannn bbbrrriiiaaannn revised this gist Jan 22, 2013. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -87,9 +87,9 @@ A friendly reminder that you may need to set this property on your target/select

    `input[type="range"]::-webkit-slider-thumb`

    `input[type="range"]::-webkit-slider-thumb:disabled`
    ` :disabled`

    `input[type="range"]::-webkit-slider-thumb:hover`
    ` :hover`

    `input[type="range"]::-webkit-slider-container`

  5. @bbbrrriiiaaannn bbbrrriiiaaannn revised this gist Jan 22, 2013. 1 changed file with 167 additions and 4 deletions.
    171 changes: 167 additions & 4 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -16,50 +16,83 @@ A friendly reminder that you may need to set this property on your target/select
    -------------

    `video::-webkit-media-controls-panel`

    `video::-webkit-media-controls-play-button`

    `video::-webkit-media-controls-volume-slider-container`

    `video::-webkit-media-controls-volume-slider`

    `video::-webkit-media-controls-mute-button`

    `video::-webkit-media-controls-timeline`

    `video::-webkit-media-controls-current-time-display`

    `video::-webkit-full-page-media::-webkit-media-controls-panel`

    `video::-webkit-media-controls-timeline-container`

    `video::-webkit-media-controls-time-remaining-display`

    `video::-webkit-media-controls-seek-back-button`

    `video::-webkit-media-controls-seek-forward-button`

    `video::-webkit-media-controls-fullscreen-button`

    `video::-webkit-media-controls-rewind-button`

    `video::-webkit-media-controls-return-to-realtime-button`

    `video::-webkit-media-controls-toggle-closed-captions-button`


    <audio>
    -------------

    `audio::-webkit-media-controls-panel`

    `audio::-webkit-media-controls-mute-button`

    `audio::-webkit-media-controls-play-button`

    `audio::-webkit-media-controls-timeline-container`

    `audio::-webkit-media-controls-current-time-display`

    `audio::-webkit-media-controls-time-remaining-display`

    `audio::-webkit-media-controls-timeline`

    `audio::-webkit-media-controls-volume-slider-container`

    `audio::-webkit-media-controls-volume-slider`

    `audio::-webkit-media-controls-seek-back-button`

    `audio::-webkit-media-controls-seek-forward-button`

    `audio::-webkit-media-controls-fullscreen-button`

    `audio::-webkit-media-controls-rewind-button`

    `audio::-webkit-media-controls-return-to-realtime-button`

    `audio::-webkit-media-controls-toggle-closed-captions-button`


    <input type="range">
    -------------------

    `input[type="range"]::-webkit-slider-thumb`

    `input[type="range"]::-webkit-slider-thumb:disabled`

    `input[type="range"]::-webkit-slider-thumb:hover`

    `input[type="range"]::-webkit-slider-container`

    `input[type="range"]::-webkit-slider-runnable-track`


    @@ -73,6 +106,7 @@ A friendly reminder that you may need to set this property on your target/select
    ---------------------------

    `input[type="number"]::-webkit-inner-spin-button`

    `input[type="number"]::-webkit-outer-spin-button`


    @@ -93,28 +127,39 @@ Form validation message-bubbe (WebKit r82180 or later)
    ------------------------------------------------------

    `::-webkit-validation-bubble`

    `::-webkit-validation-bubble-arrow-clipper`

    `::-webkit-validation-bubble-arrow`

    `::-webkit-validation-bubble-message`

    `::-webkit-validation-bubble-heading`

    `::-webkit-validation-bubble-text-block`


    <progress>
    ----------------

    `progress::-webkit-progress-bar`

    `progress::-webkit-progress-value`


    <meter>
    -------------

    `meter::-webkit-progress-bar`

    `meter::-webkit-meter-optimum-value`

    `meter::-webkit-meter-suboptimum-value`

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

    `meter::-webkit-meter-horizontal-bar`

    `meter::-webkit-meter-vertical-bar`


    @@ -128,132 +173,250 @@ Search
    ------

    `::-webkit-search-cancel-button`

    `::-webkit-search-decoration`

    `::-webkit-search-results-button`

    `::-webkit-search-results-decoration`


    Scrollbar
    ---------

    `::-webkit-scrollbar`

    `::-webkit-scrollbar:horizontal`

    `::-webkit-scrollbar:horizontal:corner-present`

    `::-webkit-scrollbar:horizontal:window-inactive`

    `::-webkit-scrollbar:vertical`

    `::-webkit-scrollbar:vertical:corner-present`

    `::-webkit-scrollbar:vertical:window-inactive`

    `::-webkit-scrollbar-button`

    `::-webkit-scrollbar-button:disabled`

    `::-webkit-scrollbar-button:double-button:horizontal:end:decrement`

    `::-webkit-scrollbar-button:double-button:horizontal:end:increment`

    `::-webkit-scrollbar-button:double-button:horizontal:end:increment:corner-present`

    `::-webkit-scrollbar-button:double-button:horizontal:start:decrement`

    `::-webkit-scrollbar-button:double-button:horizontal:start:increment`

    `::-webkit-scrollbar-button:double-button:vertical:end:decrement`

    `::-webkit-scrollbar-button:double-button:vertical:end:increment`

    `::-webkit-scrollbar-button:double-button:vertical:end:increment:corner-present`

    `::-webkit-scrollbar-button:double-button:vertical:start:decrement`

    `::-webkit-scrollbar-button:double-button:vertical:start:increment`

    `::-webkit-scrollbar-button:end`

    `::-webkit-scrollbar-button:end:decrement`

    `::-webkit-scrollbar-button:end:increment`

    `::-webkit-scrollbar-button:horizontal`

    `::-webkit-scrollbar-button:horizontal:decrement`

    `::-webkit-scrollbar-button:horizontal:decrement:active`

    `::-webkit-scrollbar-button:horizontal:decrement:hover`

    `::-webkit-scrollbar-button:horizontal:decrement:window-inactive`

    `::-webkit-scrollbar-button:horizontal:end`

    `::-webkit-scrollbar-button:horizontal:end:decrement`

    `::-webkit-scrollbar-button:horizontal:end:increment`

    `::-webkit-scrollbar-button:horizontal:end:increment:corner-present`

    `::-webkit-scrollbar-button:horizontal:increment`

    `::-webkit-scrollbar-button:horizontal:increment:active`

    `::-webkit-scrollbar-button:horizontal:increment:hover`

    `::-webkit-scrollbar-button:horizontal:increment:window-inactive`

    `::-webkit-scrollbar-button:horizontal:start`

    `::-webkit-scrollbar-button:horizontal:start:decrement`

    `::-webkit-scrollbar-button:horizontal:start:increment`

    `::-webkit-scrollbar-button:start`

    `::-webkit-scrollbar-button:start:decrement`

    `::-webkit-scrollbar-button:start:increment`

    `::-webkit-scrollbar-button:vertical`

    `::-webkit-scrollbar-button:vertical:decrement`

    `::-webkit-scrollbar-button:vertical:decrement:active`

    `::-webkit-scrollbar-button:vertical:decrement:hover`

    `::-webkit-scrollbar-button:vertical:decrement:window-inactive`

    `::-webkit-scrollbar-button:vertical:end`

    `::-webkit-scrollbar-button:vertical:end:decrement`

    `::-webkit-scrollbar-button:vertical:end:increment`

    `::-webkit-scrollbar-button:vertical:end:increment:corner-present`

    `::-webkit-scrollbar-button:vertical:increment`

    `::-webkit-scrollbar-button:vertical:increment:active`

    `::-webkit-scrollbar-button:vertical:increment:hover`

    `::-webkit-scrollbar-button:vertical:increment:window-inactive`

    `::-webkit-scrollbar-button:vertical:start`

    `::-webkit-scrollbar-button:vertical:start:decrement`

    `::-webkit-scrollbar-button:vertical:start:increment`

    `::-webkit-scrollbar-corner`

    `::-webkit-scrollbar-corner:window-inactive`

    `::-webkit-scrollbar-thumb`

    `::-webkit-scrollbar-thumb:horizontal`

    `::-webkit-scrollbar-thumb:horizontal:active`

    `::-webkit-scrollbar-thumb:horizontal:hover`

    `::-webkit-scrollbar-thumb:horizontal:window-inactive`

    `::-webkit-scrollbar-thumb:vertical`

    `::-webkit-scrollbar-thumb:vertical:active`

    `::-webkit-scrollbar-thumb:vertical:hover`

    `::-webkit-scrollbar-thumb:vertical:window-inactive`

    `::-webkit-scrollbar-track`

    `::-webkit-scrollbar-track:disabled`

    `::-webkit-scrollbar-track:horizontal`

    `::-webkit-scrollbar-track:horizontal:disabled`

    `::-webkit-scrollbar-track:horizontal:disabled:corner-present`

    `::-webkit-scrollbar-track:vertical:disabled`

    `::-webkit-scrollbar-track:vertical:disabled:corner-present`

    `::-webkit-scrollbar-track-piece`

    `::-webkit-scrollbar-track-piece:disabled`

    `::-webkit-scrollbar-track-piece:end`

    `::-webkit-scrollbar-track-piece:horizontal:decrement`

    `::-webkit-scrollbar-track-piece:horizontal:decrement:active`

    `::-webkit-scrollbar-track-piece:horizontal:decrement:hover`

    `::-webkit-scrollbar-track-piece:horizontal:end`

    `::-webkit-scrollbar-track-piece:horizontal:end:corner-present`

    `::-webkit-scrollbar-track-piece:horizontal:end:double-button`

    `::-webkit-scrollbar-track-piece:horizontal:end:no-button`

    `::-webkit-scrollbar-track-piece:horizontal:end:no-button:corner-present`

    `::-webkit-scrollbar-track-piece:horizontal:end:single-button`

    `::-webkit-scrollbar-track-piece:horizontal:increment`

    `::-webkit-scrollbar-track-piece:horizontal:increment:active`

    `::-webkit-scrollbar-track-piece:horizontal:increment:hover`

    `::-webkit-scrollbar-track-piece:horizontal:start`

    `::-webkit-scrollbar-track-piece:horizontal:start:double-button`

    `::-webkit-scrollbar-track-piece:horizontal:start:no-button`

    `::-webkit-scrollbar-track-piece:horizontal:start:single-button`

    `::-webkit-scrollbar-track-piece:start`

    `::-webkit-scrollbar-track-piece:vertical:decrement`

    `::-webkit-scrollbar-track-piece:vertical:decrement:active`

    `::-webkit-scrollbar-track-piece:vertical:decrement:hover`

    `::-webkit-scrollbar-track-piece:vertical:end`

    `::-webkit-scrollbar-track-piece:vertical:end:corner-present`

    `::-webkit-scrollbar-track-piece:vertical:end:double-button`

    `::-webkit-scrollbar-track-piece:vertical:end:no-button`

    `::-webkit-scrollbar-track-piece:vertical:end:no-button:corner-present`

    `::-webkit-scrollbar-track-piece:vertical:end:single-button`

    `::-webkit-scrollbar-track-piece:vertical:increment`

    `::-webkit-scrollbar-track-piece:vertical:increment:active`

    `::-webkit-scrollbar-track-piece:vertical:increment:hover`

    `::-webkit-scrollbar-track-piece:vertical:start`

    `::-webkit-scrollbar-track-piece:vertical:start:double-button`

    `::-webkit-scrollbar-track-piece:vertical:start:no-button`

    `::-webkit-scrollbar-track-piece:vertical:start:single-button`

    `::-webkit-resizer`

    `::-webkit-resizer:window-inactive`


    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    --------------------------------------------------------------------
    ::-webkit-textfield-decoration-container
    ::-webkit-image-inner-element
    ::-webkit-media-controls-panel
    ::-webkit-media-controls-timeline-container
    `::-webkit-textfield-decoration-container`

    `::-webkit-image-inner-element`

    `::-webkit-media-controls-panel`

    `::-webkit-media-controls-timeline-container`
  6. @bbbrrriiiaaannn bbbrrriiiaaannn revised this gist Jan 22, 2013. 1 changed file with 150 additions and 70 deletions.
    220 changes: 150 additions & 70 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,7 @@
    A fork of updates to @afabbro's tremendous original reference document.



    An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk.

    Everything is broken up by tag, but within each the selectors aren't particularly ordered.
    @@ -12,168 +16,244 @@ A friendly reminder that you may need to set this property on your target/select
    -------------

    `video::-webkit-media-controls-panel`

    `video::-webkit-media-controls-play-button`

    `video::-webkit-media-controls-volume-slider-container`

    `video::-webkit-media-controls-volume-slider`

    `video::-webkit-media-controls-mute-button`

    `video::-webkit-media-controls-timeline`

    `video::-webkit-media-controls-current-time-display`

    `video::-webkit-full-page-media::-webkit-media-controls-panel`

    `video::-webkit-media-controls-timeline-container`

    `video::-webkit-media-controls-time-remaining-display`

    `video::-webkit-media-controls-seek-back-button`

    `video::-webkit-media-controls-seek-forward-button`

    `video::-webkit-media-controls-fullscreen-button`

    `video::-webkit-media-controls-rewind-button`

    `video::-webkit-media-controls-return-to-realtime-button`

    `video::-webkit-media-controls-toggle-closed-captions-button`


    <audio>
    -------------

    `audio::-webkit-media-controls-panel`

    `audio::-webkit-media-controls-mute-button`

    `audio::-webkit-media-controls-play-button`

    `audio::-webkit-media-controls-timeline-container`

    `audio::-webkit-media-controls-current-time-display`

    `audio::-webkit-media-controls-time-remaining-display`

    `audio::-webkit-media-controls-timeline`

    `audio::-webkit-media-controls-volume-slider-container`

    `audio::-webkit-media-controls-volume-slider`

    `audio::-webkit-media-controls-seek-back-button`

    `audio::-webkit-media-controls-seek-forward-button`

    `audio::-webkit-media-controls-fullscreen-button`

    `audio::-webkit-media-controls-rewind-button`

    `audio::-webkit-media-controls-return-to-realtime-button`

    `audio::-webkit-media-controls-toggle-closed-captions-button`


    <input type="range">
    -------------------

    `input[type="range"]::-webkit-slider-thumb`
    `input[type="range"]::-webkit-slider-thumb:disabled`
    `input[type="range"]::-webkit-slider-thumb:hover`
    `input[type="range"]::-webkit-slider-container`
    `input[type="range"]::-webkit-slider-runnable-track`


    <input type="file">
    -------------------------

    `input[type="file"]::-webkit-file-upload-button`


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

    `input[type="number"]::-webkit-inner-spin-button`

    `input[type="number"]::-webkit-outer-spin-button`


    <input type="color">
    ---------------------------

    `input[type="color"]::-webkit-color-swatch
    `input[type="color"]::-webkit-color-swatch-wrapper


    <input type="date">
    ---------------------------

    `input[type="date"]::-webkit-calendar-picker-indicator


    Form validation message-bubbe (WebKit r82180 or later)
    ------------------------------------------------------

    `::-webkit-validation-bubble`

    `::-webkit-validation-bubble-arrow-clipper`

    `::-webkit-validation-bubble-arrow`

    `::-webkit-validation-bubble-message`
    `::-webkit-validation-bubble-heading`
    `::-webkit-validation-bubble-text-block`


    <progress>
    ----------------

    `progress::-webkit-progress-bar`

    `progress::-webkit-progress-value`


    <meter>
    -------------

    `meter::-webkit-progress-bar`

    `meter::-webkit-meter-optimum-value`

    `meter::-webkit-meter-suboptimum-value`

    `meter::-webkit-meter-even-less-good-value`
    `meter::-webkit-meter-horizontal-bar`
    `meter::-webkit-meter-vertical-bar`


    <details>
    ---------------

    `details::-webkit-details-marker`


    Search
    ------

    `::-webkit-search-cancel-button`

    `::-webkit-search-decoration`

    `::-webkit-search-results-button`

    `::-webkit-search-results-decoration`


    Scrollbar
    ---------

    `::-webkit-scrollbar`

    `::-webkit-scrollbar:horizontal`
    `::-webkit-scrollbar:horizontal:corner-present`
    `::-webkit-scrollbar:horizontal:window-inactive`
    `::-webkit-scrollbar:vertical`
    `::-webkit-scrollbar:vertical:corner-present`
    `::-webkit-scrollbar:vertical:window-inactive`
    `::-webkit-scrollbar-button`

    `::-webkit-scrollbar-button:disabled`
    `::-webkit-scrollbar-button:double-button:horizontal:end:decrement`
    `::-webkit-scrollbar-button:double-button:horizontal:end:increment`
    `::-webkit-scrollbar-button:double-button:horizontal:end:increment:corner-present`
    `::-webkit-scrollbar-button:double-button:horizontal:start:decrement`
    `::-webkit-scrollbar-button:double-button:horizontal:start:increment`
    `::-webkit-scrollbar-button:double-button:vertical:end:decrement`
    `::-webkit-scrollbar-button:double-button:vertical:end:increment`
    `::-webkit-scrollbar-button:double-button:vertical:end:increment:corner-present`
    `::-webkit-scrollbar-button:double-button:vertical:start:decrement`
    `::-webkit-scrollbar-button:double-button:vertical:start:increment`
    `::-webkit-scrollbar-button:end`
    `::-webkit-scrollbar-button:end:decrement`
    `::-webkit-scrollbar-button:end:increment`
    `::-webkit-scrollbar-button:horizontal`
    `::-webkit-scrollbar-button:horizontal:decrement`
    `::-webkit-scrollbar-button:horizontal:decrement:active`
    `::-webkit-scrollbar-button:horizontal:decrement:hover`
    `::-webkit-scrollbar-button:horizontal:decrement:window-inactive`
    `::-webkit-scrollbar-button:horizontal:end`
    `::-webkit-scrollbar-button:horizontal:end:decrement`
    `::-webkit-scrollbar-button:horizontal:end:increment`
    `::-webkit-scrollbar-button:horizontal:end:increment:corner-present`
    `::-webkit-scrollbar-button:horizontal:increment`
    `::-webkit-scrollbar-button:horizontal:increment:active`
    `::-webkit-scrollbar-button:horizontal:increment:hover`
    `::-webkit-scrollbar-button:horizontal:increment:window-inactive`
    `::-webkit-scrollbar-button:horizontal:start`
    `::-webkit-scrollbar-button:horizontal:start:decrement`
    `::-webkit-scrollbar-button:horizontal:start:increment`
    `::-webkit-scrollbar-button:start`
    `::-webkit-scrollbar-button:start:decrement`
    `::-webkit-scrollbar-button:start:increment`
    `::-webkit-scrollbar-button:vertical`
    `::-webkit-scrollbar-button:vertical:decrement`
    `::-webkit-scrollbar-button:vertical:decrement:active`
    `::-webkit-scrollbar-button:vertical:decrement:hover`
    `::-webkit-scrollbar-button:vertical:decrement:window-inactive`
    `::-webkit-scrollbar-button:vertical:end`
    `::-webkit-scrollbar-button:vertical:end:decrement`
    `::-webkit-scrollbar-button:vertical:end:increment`
    `::-webkit-scrollbar-button:vertical:end:increment:corner-present`
    `::-webkit-scrollbar-button:vertical:increment`
    `::-webkit-scrollbar-button:vertical:increment:active`
    `::-webkit-scrollbar-button:vertical:increment:hover`
    `::-webkit-scrollbar-button:vertical:increment:window-inactive`
    `::-webkit-scrollbar-button:vertical:start`
    `::-webkit-scrollbar-button:vertical:start:decrement`
    `::-webkit-scrollbar-button:vertical:start:increment`
    `::-webkit-scrollbar-corner`

    `::-webkit-scrollbar-corner:window-inactive`
    `::-webkit-scrollbar-thumb`

    `::-webkit-scrollbar-thumb:horizontal`
    `::-webkit-scrollbar-thumb:horizontal:active`
    `::-webkit-scrollbar-thumb:horizontal:hover`
    `::-webkit-scrollbar-thumb:horizontal:window-inactive`
    `::-webkit-scrollbar-thumb:vertical`
    `::-webkit-scrollbar-thumb:vertical:active`
    `::-webkit-scrollbar-thumb:vertical:hover`
    `::-webkit-scrollbar-thumb:vertical:window-inactive`
    `::-webkit-scrollbar-track`

    `::-webkit-scrollbar-track:disabled`
    `::-webkit-scrollbar-track:horizontal`
    `::-webkit-scrollbar-track:horizontal:disabled`
    `::-webkit-scrollbar-track:horizontal:disabled:corner-present`
    `::-webkit-scrollbar-track:vertical:disabled`
    `::-webkit-scrollbar-track:vertical:disabled:corner-present`
    `::-webkit-scrollbar-track-piece`
    `::-webkit-scrollbar-track-piece:disabled`
    `::-webkit-scrollbar-track-piece:end`
    `::-webkit-scrollbar-track-piece:horizontal:decrement`
    `::-webkit-scrollbar-track-piece:horizontal:decrement:active`
    `::-webkit-scrollbar-track-piece:horizontal:decrement:hover`
    `::-webkit-scrollbar-track-piece:horizontal:end`
    `::-webkit-scrollbar-track-piece:horizontal:end:corner-present`
    `::-webkit-scrollbar-track-piece:horizontal:end:double-button`
    `::-webkit-scrollbar-track-piece:horizontal:end:no-button`
    `::-webkit-scrollbar-track-piece:horizontal:end:no-button:corner-present`
    `::-webkit-scrollbar-track-piece:horizontal:end:single-button`
    `::-webkit-scrollbar-track-piece:horizontal:increment`
    `::-webkit-scrollbar-track-piece:horizontal:increment:active`
    `::-webkit-scrollbar-track-piece:horizontal:increment:hover`
    `::-webkit-scrollbar-track-piece:horizontal:start`
    `::-webkit-scrollbar-track-piece:horizontal:start:double-button`
    `::-webkit-scrollbar-track-piece:horizontal:start:no-button`
    `::-webkit-scrollbar-track-piece:horizontal:start:single-button`
    `::-webkit-scrollbar-track-piece:start`
    `::-webkit-scrollbar-track-piece:vertical:decrement`
    `::-webkit-scrollbar-track-piece:vertical:decrement:active`
    `::-webkit-scrollbar-track-piece:vertical:decrement:hover`
    `::-webkit-scrollbar-track-piece:vertical:end`
    `::-webkit-scrollbar-track-piece:vertical:end:corner-present`
    `::-webkit-scrollbar-track-piece:vertical:end:double-button`
    `::-webkit-scrollbar-track-piece:vertical:end:no-button`
    `::-webkit-scrollbar-track-piece:vertical:end:no-button:corner-present`
    `::-webkit-scrollbar-track-piece:vertical:end:single-button`
    `::-webkit-scrollbar-track-piece:vertical:increment`
    `::-webkit-scrollbar-track-piece:vertical:increment:active`
    `::-webkit-scrollbar-track-piece:vertical:increment:hover`
    `::-webkit-scrollbar-track-piece:vertical:start`
    `::-webkit-scrollbar-track-piece:vertical:start:double-button`
    `::-webkit-scrollbar-track-piece:vertical:start:no-button`
    `::-webkit-scrollbar-track-piece:vertical:start:single-button`
    `::-webkit-resizer`
    `::-webkit-resizer:window-inactive`


    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    --------------------------------------------------------------------
    -webkit-inner-spin-button

    -webkit-input-placeholder

    -webkit-input-speech-button

    -webkit-meter-horizontal-bar

    -webkit-meter-horizontal-even-less-good-value

    -webkit-meter-horizontal-optimum-value

    -webkit-meter-horizontal-suboptimal-value

    -webkit-meter-vertical-bar

    -webkit-outer-spin-button

    -webkit-progress-bar-value

    -webkit-resizer




    ::-webkit-textfield-decoration-container
    ::-webkit-image-inner-element
    ::-webkit-media-controls-panel
    ::-webkit-media-controls-timeline-container
  7. Angelina Fabbro revised this gist Oct 7, 2012. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk. I'm in the WebKit source so you don't have to be!
    An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk.

    Everything is broken up by tag, but within each the selectors aren't particularly ordered.

  8. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 9 additions and 0 deletions.
    9 changes: 9 additions & 0 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -139,10 +139,15 @@ Scrollbar
    ---------

    `::-webkit-scrollbar`

    `::-webkit-scrollbar-button`

    `::-webkit-scrollbar-corner`

    `::-webkit-scrollbar-thumb`

    `::-webkit-scrollbar-track`

    `::-webkit-scrollbar-track-piece`

    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    @@ -168,3 +173,7 @@ Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    -webkit-progress-bar-value

    -webkit-resizer




  9. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 29 additions and 11 deletions.
    40 changes: 29 additions & 11 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -124,29 +124,47 @@ Form validation message-bubbe (WebKit r82180 or later)

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

    Search
    ------

    `::-webkit-search-cancel-button`

    `::-webkit-search-decoration`

    `::-webkit-search-results-button`

    `::-webkit-search-results-decoration`

    Scrollbar
    ---------

    `::-webkit-scrollbar`
    `::-webkit-scrollbar-button`
    `::-webkit-scrollbar-corner`
    `::-webkit-scrollbar-thumb`
    `::-webkit-scrollbar-track`
    `::-webkit-scrollbar-track-piece`

    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    --------------------------------------------------------------------
    -webkit-inner-spin-button

    -webkit-input-placeholder

    -webkit-input-speech-button

    -webkit-meter-horizontal-bar

    -webkit-meter-horizontal-even-less-good-value

    -webkit-meter-horizontal-optimum-value

    -webkit-meter-horizontal-suboptimal-value

    -webkit-meter-vertical-bar

    -webkit-outer-spin-button

    -webkit-progress-bar-value
    -webkit-resizer
    -webkit-scrollbar
    -webkit-scrollbar-button
    -webkit-scrollbar-corner
    -webkit-scrollbar-thumb
    -webkit-scrollbar-track
    -webkit-scrollbar-track-piece
    -webkit-search-cancel-button
    -webkit-search-decoration
    -webkit-search-results-button
    -webkit-search-results-decoration

    -webkit-resizer
  10. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 24 additions and 24 deletions.
    48 changes: 24 additions & 24 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -25,7 +25,7 @@ A friendly reminder that you may need to set this property on your target/select

    `video::-webkit-media-controls-current-time-display`

    `video:-webkit-full-page-media::-webkit-media-controls-panel`
    `video::-webkit-full-page-media::-webkit-media-controls-panel`

    `video::-webkit-media-controls-timeline-container`

    @@ -88,6 +88,24 @@ A friendly reminder that you may need to set this property on your target/select

    `input[type="file"]::-webkit-file-upload-button`

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

    `input[type="number"]::-webkit-inner-spin-button`

    `input[type="number"]::-webkit-outer-spin-button`

    Form validation message-bubbe (WebKit r82180 or later)
    ------------------------------------------------------

    `::-webkit-validation-bubble`

    `::-webkit-validation-bubble-arrow-clipper`

    `::-webkit-validation-bubble-arrow`

    `::-webkit-validation-bubble-message`

    <progress>
    ----------------

    @@ -96,6 +114,7 @@ A friendly reminder that you may need to set this property on your target/select
    `progress::-webkit-progress-value`

    <meter>
    -------------

    `meter::-webkit-progress-bar`

    @@ -105,37 +124,18 @@ A friendly reminder that you may need to set this property on your target/select

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


    Unsorted
    --------
    Unsorted/Haven't investigated usage at all yet (Could contain dupes)
    --------------------------------------------------------------------
    -webkit-inner-spin-button
    -webkit-input-placeholder
    -webkit-input-speech-button
    -webkit-media-controls-current-time-display
    -webkit-media-controls-fullscreen-button
    -webkit-media-controls-mute-button
    -webkit-media-controls-panel
    -webkit-media-controls-play-button
    -webkit-media-controls-return-to-realtime-button
    -webkit-media-controls-rewind-button
    -webkit-media-controls-seek-back-button
    -webkit-media-controls-seek-forward-button
    -webkit-media-controls-status-display
    -webkit-media-controls-time-remaining-display
    -webkit-media-controls-timeline
    -webkit-media-controls-timeline-container
    -webkit-media-controls-toggle-closed-captions-button
    -webkit-media-controls-volume-slider
    -webkit-media-controls-volume-slider-container
    -webkit-media-controls-volume-slider-mute-button

    -webkit-meter-horizontal-bar
    -webkit-meter-horizontal-even-less-good-value
    -webkit-meter-horizontal-optimum-value
    -webkit-meter-horizontal-suboptimal-value
    -webkit-meter-vertical-bar
    -webkit-meter-vertical-even-less-good-value
    -webkit-meter-vertical-optimum-value
    -webkit-meter-vertical-suboptimal-value

    -webkit-outer-spin-button
    -webkit-progress-bar-value
    -webkit-resizer
  11. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 69 additions and 5 deletions.
    74 changes: 69 additions & 5 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -79,10 +79,74 @@ A friendly reminder that you may need to set this property on your target/select

    <input type="range">
    -------------------
    `input[type="range"]::-webkit-slider-thumb'

    `input[type="range"]::-webkit-slider-thumb`


    <input type="file">
    -------------------------

    `input[type="file"]::-webkit-file-upload-button`

    <progress>
    ----------------

    `progress::-webkit-progress-bar`

    `progress::-webkit-progress-value`

    <meter>

    `meter::-webkit-progress-bar`

    `meter::-webkit-meter-optimum-value`

    `meter::-webkit-meter-suboptimum-value`

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


    Unsorted
    --------
    -webkit-inner-spin-button
    -webkit-input-placeholder
    -webkit-input-speech-button
    -webkit-media-controls-current-time-display
    -webkit-media-controls-fullscreen-button
    -webkit-media-controls-mute-button
    -webkit-media-controls-panel
    -webkit-media-controls-play-button
    -webkit-media-controls-return-to-realtime-button
    -webkit-media-controls-rewind-button
    -webkit-media-controls-seek-back-button
    -webkit-media-controls-seek-forward-button
    -webkit-media-controls-status-display
    -webkit-media-controls-time-remaining-display
    -webkit-media-controls-timeline
    -webkit-media-controls-timeline-container
    -webkit-media-controls-toggle-closed-captions-button
    -webkit-media-controls-volume-slider
    -webkit-media-controls-volume-slider-container
    -webkit-media-controls-volume-slider-mute-button
    -webkit-meter-horizontal-bar
    -webkit-meter-horizontal-even-less-good-value
    -webkit-meter-horizontal-optimum-value
    -webkit-meter-horizontal-suboptimal-value
    -webkit-meter-vertical-bar
    -webkit-meter-vertical-even-less-good-value
    -webkit-meter-vertical-optimum-value
    -webkit-meter-vertical-suboptimal-value
    -webkit-outer-spin-button
    -webkit-progress-bar-value
    -webkit-resizer
    -webkit-scrollbar
    -webkit-scrollbar-button
    -webkit-scrollbar-corner
    -webkit-scrollbar-thumb
    -webkit-scrollbar-track
    -webkit-scrollbar-track-piece
    -webkit-search-cancel-button
    -webkit-search-decoration
    -webkit-search-results-button
    -webkit-search-results-decoration

    Unsorted/Untested
    -----------------

    `-webkit-file-upload-button`
  12. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 57 additions and 29 deletions.
    86 changes: 57 additions & 29 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,10 +1,12 @@
    Have to fight the good fight and compile a list of these selectors. Please submit if you know of any I have missed.
    An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk. I'm in the WebKit source so you don't have to be!

    Remember to set this property on the elements you select to get the control you need to modify their appearance:
    Everything is broken up by tag, but within each the selectors aren't particularly ordered.

    `-webkit-appearance:none;`
    I have not tested/verified all of these. Have I missed some or got it wrong? Let me know. - A

    A friendly reminder that you may need to set this property on your target/selected element to get the styling results you want:

    `-webkit-appearance:none;`

    <video>
    -------------
    @@ -17,14 +19,65 @@ Remember to set this property on the elements you select to get the control you

    `video::-webkit-media-controls-volume-slider`

    `video::-webkit-media-controls-mute-button`

    `video::-webkit-media-controls-timeline`

    `video::-webkit-media-controls-current-time-display`

    `video:-webkit-full-page-media::-webkit-media-controls-panel`

    `video::-webkit-media-controls-timeline-container`

    `video::-webkit-media-controls-time-remaining-display`

    `video::-webkit-media-controls-seek-back-button`

    `video::-webkit-media-controls-seek-forward-button`

    `video::-webkit-media-controls-fullscreen-button`

    `video::-webkit-media-controls-rewind-button`

    `video::-webkit-media-controls-return-to-realtime-button`

    `video::-webkit-media-controls-toggle-closed-captions-button`

    <audio>
    -------------

    input[type="range"]
    `audio::-webkit-media-controls-panel`

    `audio::-webkit-media-controls-mute-button`

    `audio::-webkit-media-controls-play-button`

    `audio::-webkit-media-controls-timeline-container`

    `audio::-webkit-media-controls-current-time-display`

    `audio::-webkit-media-controls-time-remaining-display`

    `audio::-webkit-media-controls-timeline`

    `audio::-webkit-media-controls-volume-slider-container`

    `audio::-webkit-media-controls-volume-slider`

    `audio::-webkit-media-controls-seek-back-button`

    `audio::-webkit-media-controls-seek-forward-button`

    `audio::-webkit-media-controls-fullscreen-button`

    `audio::-webkit-media-controls-rewind-button`

    `audio::-webkit-media-controls-return-to-realtime-button`

    `audio::-webkit-media-controls-toggle-closed-captions-button`


    <input type="range">
    -------------------
    `input[type="range"]::-webkit-slider-thumb'

    @@ -33,28 +86,3 @@ Unsorted/Untested
    -----------------

    `-webkit-file-upload-button`
    + (audio::-webkit-media-controls-panel):
    + (video::-webkit-media-controls-panel):
    + (video:-webkit-full-page-media::-webkit-media-controls-panel):
    + (audio::-webkit-media-controls-mute-button):
    + (video::-webkit-media-controls-mute-button):
    + (audio::-webkit-media-controls-play-button):
    + (video::-webkit-media-controls-play-button):
    + (audio::-webkit-media-controls-timeline-container):
    + (video::-webkit-media-controls-timeline-container):
    + (audio::-webkit-media-controls-current-time-display):
    + (video::-webkit-media-controls-current-time-display):
    + (audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display):
    + (audio::-webkit-media-controls-timeline):
    + (video::-webkit-media-controls-timeline):
    + (audio::-webkit-media-controls-volume-slider-container):
    + (video::-webkit-media-controls-volume-slider-container):
    + (audio::-webkit-media-controls-volume-slider):
    + (video::-webkit-media-controls-volume-slider):
    + (audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button):
    + (audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button):
    + (audio::-webkit-media-controls-fullscreen-button):
    + (video::-webkit-media-controls-fullscreen-button):
    + (audio::-webkit-media-controls-rewind-button, video::-webkit-media-controls-rewind-button):
    + (audio::-webkit-media-controls-return-to-realtime-button, video::-webkit-media-controls-return-to-realtime-button):
    + (audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button):
  13. Angelina Fabbro revised this gist Sep 21, 2012. 2 changed files with 60 additions and 22 deletions.
    60 changes: 60 additions & 0 deletions webkit-pseudo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,60 @@
    Have to fight the good fight and compile a list of these selectors. Please submit if you know of any I have missed.

    Remember to set this property on the elements you select to get the control you need to modify their appearance:

    `-webkit-appearance:none;`



    <video>
    -------------

    `video::-webkit-media-controls-panel`

    `video::-webkit-media-controls-play-button`

    `video::-webkit-media-controls-volume-slider-container`

    `video::-webkit-media-controls-volume-slider`

    `video::-webkit-media-controls-timeline`

    `video::-webkit-media-controls-current-time-display`

    <audio>
    -------------

    input[type="range"]
    -------------------
    `input[type="range"]::-webkit-slider-thumb'


    Unsorted/Untested
    -----------------

    `-webkit-file-upload-button`
    + (audio::-webkit-media-controls-panel):
    + (video::-webkit-media-controls-panel):
    + (video:-webkit-full-page-media::-webkit-media-controls-panel):
    + (audio::-webkit-media-controls-mute-button):
    + (video::-webkit-media-controls-mute-button):
    + (audio::-webkit-media-controls-play-button):
    + (video::-webkit-media-controls-play-button):
    + (audio::-webkit-media-controls-timeline-container):
    + (video::-webkit-media-controls-timeline-container):
    + (audio::-webkit-media-controls-current-time-display):
    + (video::-webkit-media-controls-current-time-display):
    + (audio::-webkit-media-controls-time-remaining-display, video::-webkit-media-controls-time-remaining-display):
    + (audio::-webkit-media-controls-timeline):
    + (video::-webkit-media-controls-timeline):
    + (audio::-webkit-media-controls-volume-slider-container):
    + (video::-webkit-media-controls-volume-slider-container):
    + (audio::-webkit-media-controls-volume-slider):
    + (video::-webkit-media-controls-volume-slider):
    + (audio::-webkit-media-controls-seek-back-button, video::-webkit-media-controls-seek-back-button):
    + (audio::-webkit-media-controls-seek-forward-button, video::-webkit-media-controls-seek-forward-button):
    + (audio::-webkit-media-controls-fullscreen-button):
    + (video::-webkit-media-controls-fullscreen-button):
    + (audio::-webkit-media-controls-rewind-button, video::-webkit-media-controls-rewind-button):
    + (audio::-webkit-media-controls-return-to-realtime-button, video::-webkit-media-controls-return-to-realtime-button):
    + (audio::-webkit-media-controls-toggle-closed-captions-button, video::-webkit-media-controls-toggle-closed-captions-button):
    22 changes: 0 additions & 22 deletions webkit-psuedo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,22 +0,0 @@
    Have to fight the good fight and compile a list of these selectors. Please submit if you know of any I have missed.

    Remember to set this property on the elements you select to get the control you need to modify their appearance:

    `-webkit-appearance:none;`



    <video>
    -------

    `video::-webkit-media-controls-panel`

    `video::-webkit-media-controls-play-button`

    `video::-webkit-media-controls-volume-slider-container`

    `video::-webkit-media-controls-volume-slider`

    `video::-webkit-media-controls-timeline`

    `video::-webkit-media-controls-current-time-display`
  14. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 14 additions and 6 deletions.
    20 changes: 14 additions & 6 deletions webkit-psuedo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,14 +1,22 @@
    Have to fight the good fight and compile a list of these selectors. Please submit if you know of any I have missed.

    Remember to set this property on the elements you select to get the control you need to modify their appearance:

    `-webkit-appearance:none;`



    <video>
    -------

    video::-webkit-media-controls-panel
    `video::-webkit-media-controls-panel`

    video::-webkit-media-controls-play-button
    `video::-webkit-media-controls-play-button`

    video::-webkit-media-controls-volume-slider-container
    `video::-webkit-media-controls-volume-slider-container`

    video::-webkit-media-controls-volume-slider
    `video::-webkit-media-controls-volume-slider`

    video::-webkit-media-controls-timeline
    `video::-webkit-media-controls-timeline`

    video::-webkit-media-controls-current-time-display
    `video::-webkit-media-controls-current-time-display`
  15. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion webkit-psuedo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    <video>
    &lt;video&gt;
    -------

    video::-webkit-media-controls-panel
  16. Angelina Fabbro revised this gist Sep 21, 2012. 1 changed file with 8 additions and 0 deletions.
    8 changes: 8 additions & 0 deletions webkit-psuedo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,14 @@
    <video>
    -------

    video::-webkit-media-controls-panel

    video::-webkit-media-controls-play-button

    video::-webkit-media-controls-volume-slider-container

    video::-webkit-media-controls-volume-slider

    video::-webkit-media-controls-timeline

    video::-webkit-media-controls-current-time-display
  17. Angelina Fabbro created this gist Sep 21, 2012.
    6 changes: 6 additions & 0 deletions webkit-psuedo-elements.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,6 @@
    video::-webkit-media-controls-panel
    video::-webkit-media-controls-play-button
    video::-webkit-media-controls-volume-slider-container
    video::-webkit-media-controls-volume-slider
    video::-webkit-media-controls-timeline
    video::-webkit-media-controls-current-time-display