Make body element 100% of browser height

      
html{
  height: 100%;
}
body {
  min-height: 100%;
}      
      
      

CSS Chrome Scrollbar Styling

::-webkit-scrollbar {
    height: 12px;
    width: 12px;
    background: #000;
}

::-webkit-scrollbar-thumb {
    background: #393812;
    -webkit-border-radius: 1ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}

::-webkit-scrollbar-corner {
    background: #000;
}

Alternately, try jScrollPane which looks pretty good.

CSS Gradient

        background:linear-gradient(113deg, #252d3e, #326fa5);
      
      

Responsively center a unknown-width element

.centered-axis-x {
            position: absolute;
            left: 50%;
            transform: translate(-50%, 0);
        }
        

nth-child! Select elements whose index is a multiple of 4:

.cta-item:nth-child(4n+0) {
            /*last item in a four-column row */
            /* 3n+0 = last item in a three-col row */
            margin-right:0;
        }
        

nth-child! Select first element of every three-column row:

.cta-item:nth-child(3n+1) {
            /*first item in a three-column row */
            /* 3n+1 = first item in a three-col row */
            margin-right:0;
        }
        

Dropdown Menu troubles

• Check that overflow is not set to hidden on parents.

Center list items horizontally

li {display:inline-block;} ul {text-align:center}
        

Center horizontally and vertically

.parent { position: relative; }
        .child { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); }
        

Odd

element_that_is_a_child:nth-child(odd) {
            background:white;
        }
        

Last child

element_that_is_a_child:last-child {
            background:blue;
        }