http://d.hatena.ne.jp/ken47/ でブログを書いています。

この度、デザインを変更しました。

サイドバーのデザインについてなのですが、hatena-widgetクラスで指定しているブログパーツ部分のデザインを、はてなモジュールと同じにするにはどうすればいいでしょうか。
具体的には、はてなモジュールの下の影のようなものをhatena-widgetの部分にも付けたいです。
http://d.hatena.ne.jp/theme//ugomemo-green/blog-sidebar-bottom.gif の画像を使って表示させているのではないかと思うのですが、具体的にどんなスタイルシートを書けばいいのか分かりません。

今、スタイルシートで指定しているのは .hatena-widget{background-color: #FFFFFF} のみです。
よろしくお願いします。

回答の条件
  • 1人2回まで
  • 登録:
  • 終了:2009/02/19 22:06:08
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ベストアンサー

id:Yuichirou No.1

回答回数112ベストアンサー獲得回数36

ポイント68pt

このような場合、スタイルシートの設定を自分で書くより、HTMLの構造をはてなモジュールと同じようにしてしまう方が、デザインテーマのスタイルシート設定をそのまま活用できて効果的です。

例えば、以下のようにdivのタグを追加してみてください。

before

<div class="hatena-moduletitle">更新通知メール</div>
<div class="hatena-widget">
<form target="_blank" action="http://mixfeed.jp/subscribe" method="POST">…(略)…</form>
</div>
<br>

after

<div class="hatena-module"> <!-- ココ -->
<div class="hatena-moduletitle">更新通知メール</div>
<div class="hatena-modulebody"> <!-- ココ -->
<div class="hatena-widget">
<form target="_blank" action="http://mixfeed.jp/subscribe" method="POST">…(略)…</form>
</div>
</div> <!-- ココ -->
</div> <!-- ココ -->

(<!-- ココ --> と書いてある行を追加してください。ただし <!-- ココ --> 自体は不要です)

id:ken47

うまくいきました!

こういう方法があるんですね。これで、今後ブログパーツを追加したときも対処できます。(^_^)b

適切かつ分かりやすい回答、ありがとうございました。m(__)m

2009/02/19 22:03:11

コメントはまだありません

この質問への反応(ブックマークコメント)

トラックバック

  • デザイン変えました デザイン変えました。 でも、わかんないことがあるんで、まだ未完成です。 question:1235038846で回答受付中なんで、分かる人お願いします〜(・∀・+)
  • 人力検索すごい question:1235038846、id:Yuichirouさんが回答して下さいました。バッチリ解決です。ありがとうございます☆ 人力検索、初めて使ったけど、すごいね。o(≧ω≦)o
「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません