Show an arrow at the bottom of a container

Demonstration

Unrecognized ignorance visits us all

An ignorant mind is precisely not a spotless, empty vessel, but one that’s filled with the clutter of irrelevant or misleading life experiences, theories, facts, intuitions, strategies, algorithms, heuristics, metaphors, and hunches that regrettably have the look and feel of useful and accurate knowledge. This clutter is an unfortunate by-product of one of our greatest strengths as a species. We are unbridled pattern recognizers and profligate theorizers. Often, our theories are good enough to get us through the day, or at least to an age when we can procreate. But our genius for creative storytelling, combined with our inability to detect our own ignorance, can sometimes lead to situations that are embarrassing, unfortunate, or downright dangerous—especially in a technologically advanced, complex democratic society that occasionally invests mistaken popular beliefs with immense destructive power (Dunning, 2014).

Source

Dunning, D. (2014, October 27). We Are All Confident Idiots. Pacific Standard. https://psmag.com/social-justice/confident-idiots-92793

HTML

<div class="demo-arrow">Demo Arrow</div>

CSS

.demo-arrow {
	display: inline-block;
	position: relative;
	background: #000;
	color: #fff;
	padding: 10px 20px;
	width: 260px;
	border-radius: 4px;
}

.demo-arrow:after {
	position: absolute;	
	display: inline-block; 	
	content: '';
	left: 14px;
	top: 100%;
	width: 0;
	height: 0;
	border-top: 6px solid #000;
	border-right: 6px solid transparent;
	border-bottom: 0 solid transparent;
	border-left: 6px solid transparent;
}