How to fix avoid inline spacing on WooCommerce

Remove hard-coded text-spacing CSS properties from inline `style` attributes so users can override them with their own stylesheets.

Steps for WooCommerce

  1. In wp-admin, go to Appearance → Theme File Editor (or use a local code editor / FTP).
  2. Search your active theme's template files (`single-product.php`, `archive-product.php`, page templates, etc.) for `style=` containing the flagged spacing properties.
  3. Remove the inline property and add or extend a CSS class on that element.
  4. Add the corresponding CSS rule to your child theme's `style.css` file (never edit the parent theme directly).
  5. If a page builder (Elementor, Divi, Beaver Builder) generated the inline style, open that block/widget, find the Typography or Spacing panel, delete the custom spacing value, and save — the builder will stop emitting the inline style.
  6. Verify via Appearance → Customize → Additional CSS or the axe DevTools browser extension.
Official WooCommerce documentation ↗
<!-- BEFORE: inline spacing blocks user overrides -->
<p style="line-height: 1.4; letter-spacing: 0.05em;">Product description text</p>

<!-- AFTER: spacing lives in the stylesheet, users can override it -->
<p class="product-description">Product description text</p>

/* In your stylesheet */
.product-description {
  line-height: 1.4;
  letter-spacing: 0.05em;
}

What is avoid inline spacing?

Inline spacing refers to CSS properties like `line-height`, `letter-spacing`, `word-spacing`, and `margin-top`/`padding-top` (used to control text block spacing) that are written directly inside an HTML element's `style="…"` attribute rather than in a separate stylesheet. When these values are hard-coded inline, a user's browser or assistive-technology stylesheet cannot override them — even when that user has set their own spacing preferences to make text readable. WCAG 2.1 Success Criterion 1.4.12 ("Text Spacing") requires that users can adjust those four specific spacing properties without losing content or functionality.

Roughly 1 in 5 people have a disability that affects how they read text, and many of them rely on custom browser stylesheets or accessibility extensions that increase letter spacing, line height, or word spacing to make text legible. When your store hard-codes those values inline, their overrides are silently blocked, making your content unreadable for those shoppers — driving them directly to a competitor. Beyond lost sales, WCAG 2.1 Level AA compliance (which includes SC 1.4.12) is the baseline required by accessibility laws in the EU (EAA), UK (PSBAR), Canada (AODA), and increasingly enforced in the US under the ADA. Non-compliance exposes your business to legal complaints, demand letters, and lawsuits.

See the complete Avoid inline spacing guide for every platform and the full background.

Not sure if your WooCommerce store has this?

Run a free SEOLZ audit — we’ll find avoid inline spacing and every other issue across your whole site.

Scan my site free

Fix avoid inline spacing on another platform