はずがたり」はWordPressを利用しております。現在、サイトのテーマをサーバー上でリアルタイムに変更中です(笑)。それゆえに見苦しかったりするのだけれど、なかなかパソコンにじっくりと向かう時間が取れず作業があまり進んでおりませんでした。そんななか、今日はふたつのサイドバー(左と右)でスタイルに違いが出る理由が分からず難儀していた問題が解決。前に進めそうな気がして...少しだけ気分がよいです。以前から書いておりますように、スマートフォン、タブレット、パソコンのどれで見ても最適な表示がされるようこのサイトに「レスポンシブ・レイアウト」を取り入れているところです。スマートフォン(縦)では1カラムの縦長のページとなり、スマートフォン(横)とタブレット(縦)ではサイドバーをひとつ表示する2カラムのレイアウトにします。タブレット(横)とパソコンではサイドバーをふたつ表示して3カラムのレイアウトにします。html5とCSS3を使います。古いブラウザでは表示が崩れるのではなく、CSSが読み込まれずブラウザのデフォルト表示になるようなので特に意識して対応しなくてもよさそうです。ふたつのサイドバーの見出しの表示に違いが出てしまう問題を解決したのでした。CSS的には違いがないはずなのに、右側では<h3>の見出しが100%で表示されているのに、左側ではpadding-leftが適用されているな表示になるのです。それがどうやってもそれが解消しなかったのです。その問題が解決しました。それは結論から言えば...CSSではなくテンプレートの問題でした(笑)。ふたつのサイドバーを呼び出す方法がなぜか違っておりまして...左側はWordPressデフォルトの呼び出し方法をとっていて、右側はfunction.phpを使って自分で制御しておりました。そのためデフォルトのサイドバーを呼び出しているほうで、サイドバー全体に<ul>タグが適用されていて、それが左側にアキが生まれる原因となっておりました。生成されたhtmlのソースを表示し、サイドバーのあたりを見比べていてようやく気付くことができました。これでずっと悩んでいた問題が解決。コメントをキャンセルメールアドレスが公開されることはありません。reserved.管理RSS。