親タグにoverflowまとめあけましておめでとうございます!今年の目標はブログをちゃんと書くです。そんなわけでちゃんと書きます。今回は以下のようなイメージにします。パンくずリストの長くなりすぎたタイトルを横スクロールさせたかったんだけどCSSだけ出来ました。親タグに以下をぶちこんだだけ。2020横スクロール適用前サイト制作やブログなんて書いているとどうしても長いページやタイトルが出てきてしまい、決まった画面幅でどうやって処理させるか悩んでいました。私の場合、上記のように長くなりすぎたら文字を「...」で省略したり、カラム落ちさせたりして色々コードをぐちゃぐちゃと書き、挙句の果てはブサイクな処理になってしまいました。やって処理してるのかと調べてみると有名どころのサイトは長くなったパンくずリストのサイトを横スクロールさせているんですね。jsとかゴリゴリ書いて難しいんでしょう?と思っていたのですが意外にもCSSのみで適用できるのでした。横スクロール適用後https://yashiro-pork.tumblr.com/post/190227671045親タグにoverflowはみ出したらどう処理するかというoverflowプロパティを与えます。補助的に他のプロパティを与え結果的に以下を親タグに与えればできます。nowrap;このサイトでも2020年現在は上記のやり方で処理しています。ちなみに適用しない場合があって、私の場合は他のプロパティが干渉していました。wrap;が干渉していたのでこれを消したら適用しました。まとめなるほどこういったことはjsを使わないと出来ないと思ってましたがCSSのみで出来るんですね。最近は驚くぐらいCSSで動きが付けられますね。私にサイト制作を教えてくれた方が言われていたことなんですがCSSで出来ることはjsを使わないほうがいいと言っていました。その教えはサイト制作に携わるようになってから年々身をもって実感してきました。jsでDOM操作を行った場合、HTMLにstyle属性を与えたりする方法があると思いますが直接HTMLにstyle属性でCSSを書いてしまうと詳細度が高いため、後々外部CSSでオーバーライドさせる時適用されず!important;合戦になってしまいます。詳細度を意図的にコントロール出来る、外部CSSで書くのがいいといのがウェブ制作を通して分かってきました。後々の管理も楽ですしね。*メールアドレス(公開はされません。100%GPLテーマ作者大集合!に参加してきました。