Skip to content

Instantly share code, notes, and snippets.

p3t3r67x0 /
Last active Mar 16, 2021
A CSS pseudo-element is used to style specified parts of an element. In some cases you can style native HTML controls with vendor specific pseudo-elements. Here you will find an list of cross browser specific pseudo-element selectors.

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;

video /deep/ input[type=range] {
p3t3r67x0 /
Last active Oct 31, 2020
Be aware that every rendering engine has its own implementation of prefixed properties. As extensions are made part of the standard, the unprefixed identifier is then substituted.

Prefixed style properties


The -ms-accelerator property sets or retrieves a string that indicates whether the object represents a keyboard shortcut.

-ms-accelerator: false | true
p3t3r67x0 /
Last active Nov 30, 2020
MS Office prefixed style properties can be used for older versions of MS Excel, MS PowerPoint or MS Word when you want to save a document, presentation, workbook, or worksheet as a web document, or even in older versions for MS Outlook.

MS Office prefixed style properties


Note: Office only

mso-ansi-font-size: large | larger | <length> | medium | <percentage> | small | smaller | x-large | x-small | xx-large | xx-small
View get-colors.js
var pseudoClassesAndElementsArray = ['', ':hover', ':focus', ':active', ':first-child', ':first-of-type', ':checked', ':disabled', ':empty', ':enabled', ':invalid', ':last-child', ':last-of-type', ':link', ':only-of-type', ':only-child', ':optional', ':out-of-range', ':read-only', ':read-write', ':required', ':root', ':target', ':valid', ':visited', '::after', '::before', '::first-letter', '::first-line', '::selection', '', ];
var colorListArray = [];
function isArray(data) {
var isArrayBoolean = == '[object Array]';
return isArrayBoolean;
p3t3r67x0 / range.html
Last active Feb 1, 2019
prettify `<input type=range>` #100 pure CSS
View range.html
<input type='range' min='0' max='32' step='1' value='20'/>
<input type='range' min='0' max='32' step='1' value='7'/>
<input type='range' min='0' max='32' step='1' value='5'/>
<input type='range' min='0' max='32' step='1' value='8'/>

Beautifiul git log

git config --global alias.lg "log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit --"
git lg


Test the nginx config

$ sudo nginx -t
$ sudo nginx -t -c /etc/nginx/nginx.conf
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
p3t3r67x0 /
Last active Feb 29, 2016
Hosteurope virtual server hostname setting script


# Provides:
# Required-Start:
# Required-Stop:
# Default-Start: 2 3 4 5
# Default-Stop: 0 6
p3t3r67x0 /
Last active Nov 9, 2020
Some list of openssl commands for check and verify your keys



Install the OpenSSL on Debian based systems

sudo apt-get install openssl
p3t3r67x0 /
Last active Jun 17, 2018
Some useful vim and bash commands that I only use occasionally


Remove ^M


Remove unwanted whitespaces