jessestu/custom-css.md

## custom-css.md

      
    Raw
  

              custom-css.md
            
          
    Please go to My Site →  Customize → CSS (or Additional CSS), then add all of the following code to the bottom of that window.

/* This CSS styles the captions on https://xiaolabucla.org/people/
* 11343122-hc (jw)
*/
/* Formats the text */
.page-id-79 figcaption {
  color: #5b776b;       /* Colors */
  font-size: 16px;      /* Size */
  text-align: center;   /* Centers */
}

/* Makes bolded text show as bold */
.page-id-79 figcaption b,
.page-id-79 figcaption strong {
  font-weight: bold;
}

/* Removes background color */
.page-id-79 figure.wp-caption {
  background-color: transparent;
}

/* Places caption at top */
.page-id-79 figure.wp-caption {
  display: flex;
  flex-direction: column;
}
.page-id-79 figure.wp-caption img {
  order: 2;
}
.page-id-79 figure.wp-caption figcaption {
  order: 1;
}

Tip: keep the /* comment */ in the code to later know what this code does.
Example of where to add the CSS