ドットの下線。よほどでない限り、border:dotted;で妥協していました。明らかに◎のときは画像にしてたり。しかし今日からは迷わずCSSだけでOK。

radial-gradientを使う

CSSでドットの下線を再現するためにはbackground-image:radial-gradientを使います。
ほぼ、どのブラウザでも使えます（Can I use radial-gradient）。

.bd-btm-dotted{
	background-image: radial-gradient(#C5DAE5 30%, transparent 30%);
	background-size: 6px 6px;/*imageで指定した割合が100%の時の値*/
	background-position: bottom;
	background-repeat: repeat-x;
}

表示サンプル