ブログのタイトルロゴの右横にSNSフォローボタンが並んでいるレイアウトをWordPressなどではよく見かけますよね。無料テーマなのに超優秀な人気テーマ「simplicity」などもそうですよね。 WordPressの場合は自由にHTMLでヘッダーの構造をいじれるのですが、はてなブログではヘッダーのHTML構造は変えることができません。 そこで、HTMLを自由に書ける「ヘッダのタイトル下」部分をCSSで調整して表示することになります。 floatを使う方法もあるのですが、表示にやや難があるので、ここではposition: absolute;で位置を絶対指定することで表現します。 positionプロパティとはCSSのpositionプロパティについてはとてもわかりやすい説明がサルワカさんでありますのでそちらをご参照下さい(他力)。 saruwakakun.com 【例を挙げてざっくり説明】
![position:absoluteでタイトル横にSNSフォローボタンなどを並べる - Minimal Green](https://cdn-ak-scissors.b.st-hatena.com/image/square/ffca9763c04ddb5e2c33462da4416a5fcd215ccb/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fs%2Fsyofuso%2F20170804%2F20170804005422.jpg)