tacamy--log

JavaScriptを勉強中の人のブログです。

CSS

長方形の画像をCSSで上下左右中央に配置して正円にトリミングする

CSS

アバター画像とかをCSSで丸くくり抜くときに、img要素にborder-radius: 50%を指定するか、以下のような感じにすれば丸くくり抜きできるけど、画像が正方形じゃなかった場合に縦横比が伸びておかしくなってしまう。 <span class="avatar"> <img src="https://github.com/tacamy.png" alt=""> </span> .avatar { display: inline-block; over…

CSSではみ出した文字を省略する「text-overflow: ellipsis;」がいつの間にかPCでも使えるようになってた!

CSS

領域をはみ出したときに三点リーダー(…)で省略するtext-overflow: ellipsis;は、スマホサイトでは普通に使っていたけど、PCでは数年前に使おうとしてなんかのブラウザでダメだった記憶があって、使えないものとばかり思い込んでいた。 でも、ふとCan I use…