ブログのタイトルの表示位置を変える
いきなり数学でも音楽でも音ゲーでもないが、一応備忘録なので。
今のブログのデザインはBordeauxをつかっているのだが、ブログタイトルもブログの説明文(タイトル下)も、更にその下の記事のタイトルも左詰まりではなんだか格好わるい。
そこで、なんとかブログタイトルと説明文を中央に表示することにした。
だが、思った以上にこれに悪戦苦闘した。2時間も無駄にしてしまった。
一応備忘録として参考にさせていただいたサイトと、手順を載せておこうと思う。
ブログタイトルを中央に配置する
このサイトがほぼ答えなのだが、デザインCSSに
#blog-title { text-align: center; }
を入れても上手くタイトルが真ん中にこなかった。
そして、
>テーマによってはタイトルのclass指定が異なることがありますので、chromeの開発者ツールなどで検証してみて下さい。
の部分に書いてある通りに、いったん自分のブログをChromeで開き、表示>開発/管理>デベロッパーツールで検証した。現れたデベロッパーツールの画面の左上にあるインスペクトボタンを押す。
それからブログタイトルテキストにカーソルをあわせる。
どうやらいくつかブログタイトルテキストを包括する要素が有ることがわかる。
#blog-title {
の部分を消して、代わりに、ブログタイトルテキストを包括する要素のID
#blog-title-inner{
や
#blog-title-content{
を入れていった。すると、blog-title-contentを入れたときに上手くタイトルが真ん中に表示されてくれた。
説明文を中央に配置する
これはすぐできた。
ヘッダのタイトル下のHTMLを
<center></center>で挟むだけで良い。(見栄えの良さを気にして改行も入れた)
明日、姉の結婚式だと言うのに、寝不足が確定した。
(メモ)右の最新項目のタイトルがガタガタになっているのを直さねば