Polestar

CSS Snippets

1 min read Updated Sep 2026 Polestar

These CSS snippets cover small changes that have no Customizer setting. Add them at AppearanceCustomizeAdditional CSS or to your child theme style.css file.

Remove the Site Header Border

.site-header {
	border-bottom: none;
}

Remove the Site Footer Border

.site-footer.footer-active-sidebar {
	border-top: none;
}

Remove the Bottom Bar Border

.site-footer .bottom-bar {
	border-top: none;
}

Full-Width Header Content

Removes the maximum width from the header content.

.site-header .polestar-container {
	max-width: none;
}

Sidebar Link Color

.widget-area .widget:not(.widget_tag_cloud):not(.widget_shopping_cart) a:not(.button) {
	color: #626262;
}

.widget-area .widget:not(.widget_tag_cloud):not(.widget_shopping_cart) a:not(.button):hover {
	color: #4d8ffb;
}

Sidebar Font Size

.widget-area:not(.site-footer) .widget .widget-title~* {
	font-size: 14px;
}

Footer Widgets With Polylang

Polylang counts one widget per language. With 2 languages and 1 footer widget, Polestar makes two 50% columns. This snippet makes the widget full width.

#colophon.site-footer .widgets .widget {
	width: 100%;
}

Open Main Menu Drop-Downs to the Left

Aligns each drop-down with the right edge of its parent item. To change one item only, use the left class described in Menu Locations Usage.

.main-navigation ul .children,
.main-navigation ul .sub-menu {
	right: 0;
}

Change the Breadcrumb Font Size and Margins

The default is 13px with a 15px bottom margin.

.breadcrumbs {
	font-size: 14px;
	margin: 0 0 25px 0;
}

Hide the First Breadcrumb Trail on Page Builder Pages

.siteorigin-panels .site-content > div > .breadcrumbs {
	display: none !important;
}