Horizontal rythms

Matej Latin wrote the well said article Rhythm in Web Typography.
Hanging punctuation for lists is illustrated in this Codepen.
In my eyes both options over there are breaking the horizontal flow. Why not a solution in between: just left aligning the bullets of the list?

Vertical rhythm is a typographic concept in which lines of text are evenly spaced, i.e. regardless of font size or variant, each line must be precisely aligned to the grid of the rhythm. Just like the text you're reading at this moment.
And my shopping list:

One orange
Two apples
Three bananas

Oops! Almost closing time, so I have to hurry to the shop. Hm, I guess I should call a taxi in order to arrive in time...

.rythmbox p {
	font-size: 16px;
	line-height: 26px;
	padding: 8px 0 0 0;
	margin: 0 0 18px 0;
}
.rythmbox ul {
	font-size: 16px;
	line-height: 26px;
	padding: 8px 0 0 0;
	margin: 0 0 18px 0;
}
.rythmbox li {
	padding: 0;
	margin: 0 0 0 1em;
}

Francky Kleyneman
_____________
(This example quickly made with help of Syncope.)