Squarespace CSS: Editing Menu Block Text

Squarespace Guide

Here is code for editing font size, letter spacing, line height word spacing, uppercase/lowercase, text alignment, text color and adding text shadow.  The three sections can be used to edit the Title, Description and price.  You can use all three sections or just one or two.  You can also delete any formatting line you would like or not.  

Here is the article for changing Menu Block Titles.

To use: Open the side panel in your Squarespace 7 site and click Design, then click Custom CSS, then cut and paste the below code into that section.  You can edit all of the numbers and modifiers to your choosing.  

(I had been looking for this code for months now and finally sifted though the code using Chrome's Element Inspection until I found the elements below.   These have been tested on Marquee Theme and Pacific Theme, so I assume it will work on all templates.)

If you have questions or comments please message or leave comments below.

/* Change Menu Text */
.menu-item-title {
  font-size: 20px !important;
  letter-spacing: .1px !important;
  line-height: 0.8px !important;
  word-spacing: .01px !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: blue !important;
  text-shadow: 1px 1px 1px #0A0A0A;
 }

.menu-item-description {

font-size: 20px !important;

letter-spacing: .5px !important;

line-height: 20px !important;

word-spacing: .01px !important;

text-transform: lowercase !important;

text-align: center !important;

color: green !important;

}

.menu-item-price-bottom {  
  font-size: 20px !important;
  letter-spacing: .1px !important;
  line-height: 0.8px !important;
  word-spacing: .01px !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: blue !important;
  text-shadow: 1px 1px 1px #0A0A0A;
}