Seesaaブログのデザイン変更ワザスマートフォン専用ページを表示Seesaaブログのデザイン変更ワザcssやHTMLを編集してSeesaaブログのデザインを自由に変えてみよう!御朱印集めが楽しくなるiPhoneアプリ御朱印マップを公開しています。ダウンロードはこちらからどうぞ。Seesaaブログで、投資関係のブログを3年半ほど書いています。そのブログを続けている中で、CSSやHTMLを編集してSeesaaブログのデザイン変更にチャレンジしてきました。Seesaaブログって、かなり自由にデザインをカスタマイズできるのがいいですね!このブログでは、その様々なカスタマイズ方法をご紹介していきます。投資関係のメインブログはこちらです。【第23回】サイドバーの幅を変更する第22回からのブログの幅を変更するシリーズ。今回は、左サイドバーの幅を広げてみます。第2回でご紹介した、CSS変更画面を開いて下さい。前回解説した通り、Seesaaブログの左サイドバーは、#links-left要素で定義されています。この中で、サイドバーの幅を表すプロパティはwidthになります。従って、このwidthの値を変更すれば、サイドバーの幅が変更されることになるのです。★左サイドバーの幅を変更する方法★#links-left要素の中のwidthプロパティの値を変更する。0px;line-height:1.5;}これで、左サイドバーの幅が広くなりました。作業完了!・・・あれ?左サイドバーの幅が広くなったのは良いですが、メインコンテンツが消えてしまいました。メインコンテンツがどこに行ったかというと・・・ご覧の通り、左サイドバーの下に表示されてしまっています。これは、左サイドバーが広がった(200px⇒250px)ことにより、ブログ全体の幅(840px)では、メインコンテンツ(620px)を表示できなくなったために起こる現象です。このままではまずいですね。左サイドバーの幅自体は、これで編集完了です。メインコンテンツの表示位置がおかしいのは、まだメインコンテンツの幅を狭めていないから。この作業は、今後行っていきます。[必須入力]※画像の中の文字を半角で入力してください。※ブログオーナーが承認したコメントのみ表示されます。Seesaaブログ×この広告は180日以上新しい記事の投稿がないブログに表示されております。