What the heck is going on?


XenForo moderator
Staff member
That seems to be related to this css:

.breadcrumb .crust .arrow span {
border: 12px solid transparent;
I need to do a bit more digging though.

Jake Bunce

XenForo moderator
Staff member
Screen shot 2010-11-16 at 9.46.56 AM.png

I was able to reproduce this problem by editing this template:

Admin CP -> Appearance -> Templates -> breadcrumb.css

In the two classes below you will see a background-color and a border-left-color which both use @primaryLightest. If you change one such that the two attributes no longer use the same color then you get that color mismatch.

.breadcrumb .crust a.crumb
	@property "breadcrumbItemCrumb";
	text-decoration: none;
	background-color: @primaryLightest;
	padding: 0 10px 0 18px;
	margin-bottom: -1px;
	border-bottom: 1px solid @primaryLighter;
	outline: 0 none;
	-moz-outline-style: 0 none;
	display: block;
	line-height: 24px;
	_border-bottom: none;
	@property "/breadcrumbItemCrumb";
.breadcrumb .crust .arrow span
	@property "breadcrumbItemArrowInner";
	border: 12px solid transparent;
	border-right: 1px none black;
	border-left-color: @primaryLightest;
	display: block;
	position: absolute;
	left: -13px;
	top: -12px;
	z-index: 51;
	white-space: nowrap;
	overflow: hidden;
	text-indent: 9999px;
	width: 0px;
	height: 0px;
	@property "/breadcrumbItemArrowInner";
Hopefully this helps.