A hanging indent, or hanging paragraph, is a paragraph in which the opening line is left of the margin. In other words, the first line has a negative text indent, and that is exactly how it is created in CSS. First, our HTML markup:

<p>Leverage agile frameworks to provide a robust synopsis for high level 
overviews. Iterative approaches to corporate strategy foster collaborative
thinking to further the overall value proposition.
<p>Bring to the table win-win survival strategies to ensure proactive domination. 
At the end of the day, going forward, a new normal that has evolved from 
generation X is on the runway heading towards a streamlined cloud solution. 
User generated content in real-time will have multiple touchpoints for offshoring.

Then the CSS code, written embedded or linked:

p {
	text-indent: -4em;
}

Our immediate problem is that the element selector would apply the appearence to every paragraph. We need to restrict the effective range of the style to the first paragraph. The easiest way is with a first-of-type selector:

p:first-of-type {
	text-indent: -4em;
}

This creates a problem of its own: the first line of our first paragraph is now likely to go off the left edge of the browser window. To compensate, push the paragraph to the right using margin-left:

p:first-of-type {
	text-indent: -4em;
	margin-left: 6em;
}

We probably want all the paragraphs to share the same left edge, so rather than applying the margin-left to only the first paragraph, we should apply it to all paragraphs, while balancing the margin on the right-hand side:

p {
	margin: 6em inital;
}
p:first-of-type {
	text-indent: -4em;
}

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.
Check out the CodePen demo for this article at https://codepen.io/dudleystorey/pen/MbRLxJ