Houn

2021.07.31

Website develop

Place text in the center of a regular circle (responsive)

This is a method of placing text in the center of an equilateral circle created with responsive (not distorted by the screen size).

It doesn’t matter if it contains line breaks.

Sample and source code

The size of the circles and padding are your choice!

See the Pen
by masakitano (@masakitano)
on CodePen.

Arrange multiple circles horizontally.

In fact, this is probably how you’d use it.

A layout with three circles lined up horizontally (or vertically to fit the screen width).

This is a common “three characteristics” kind of content.

See the Pen
by masakitano (@masakitano)
on CodePen.

Share on SNSシェア

Related 関連記事

お問い合わせ