グッドデザイン賞を受賞したウォーターサーバー >>

gooブログの設定を変更した際、どこかをいじってしまったようで、レイアウトが崩れてしまい、レイアウトを初期化しても元に戻りません。(プロフィールなどのパーツがページの一番下になってしまう)http://blog.goo.ne.jp/jiyugaokamusic 修正方法をお教え下さい。

「goo ブログのレイアウトが崩れてしまい」の質問画像

このQ&Aに関連する最新のQ&A

A 回答 (5件)

ようやく言われている意味が分かりました。



よくある質問にありましたよ。
https://goo.e-srvc.com/app/answers/detail/a_id/5 …
    • good
    • 0
この回答へのお礼

何度もお付き合いいただきありがとうございました。無事解決することが出来ました。
ありがとございます。

お礼日時:2016/04/25 09:14

このようになっています。

「goo ブログのレイアウトが崩れてしまい」の回答画像4
    • good
    • 0
この回答へのお礼

ページの一番下までスクロールすると、右サイドバーに「プロフィール」が出てきます。
本来は左サイドバーのトップに出るように設定しています。

お礼日時:2016/04/24 13:36
    • good
    • 0

追記



左サイドバーでレイアウトされています。
    • good
    • 0
この回答へのお礼

さっそくのご返事ありがとうございます。

が、やはりレイアウトは崩れているままです。
選択したレイアウトは、「3カラム・両サイドバー」です。
左サイドバーの一番上に「プロフィール」を配置していますが、「カレンダー」がきてしまい、
「プロフィール」がずっと下にスクロールした右サイドバーにきています。

お礼日時:2016/04/24 09:15

普通に見れますよ。

もう一度見てください。
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qブログのサイドバーが下にくる

CSSとHTMLのレイアウト崩れに関する質問です。
サイドバーが下にずれてしまう原因として考えられるのは、
ブロック内にある、複数のブロックの幅の合計値が、親ブロックより大きくなってしまうからだと理解しています。
下のURLのブログは、突然サイドバーが下にずれるようになりました。
http://ameblo.jp/life-in-prague/

ためしにChromeのデベロッパーツールで、両サイドバーのウィジェットをひとつひとつ消してみたり、
skinContentsArea(サイドバーとメインコンテンツのラッパーの親ブロック)の幅を広くしたり、
下にずれているサイドバーの幅を10pxまで小さくしたり、
色々試したのですが、どうしてもサイドバーが正しい位置に戻りません。

しかも、「ブログデザインのCSSの編集」のプレビューモードでは、正しく表示されます。
ちょっとややこしい質問ですが、お時間がある方はどうぞ少しお時間を割いていただきたいです。

よろしくお願い申し上げます。


補足
直前に、table .prgevent, .prgevent tr, .prgevent td{padding:1px 10px;background-color:#EEE;}
table .bluecell{background:#0C54A9;color:#FFF;text-align:center;}をCSSに追加したのですが、関係ないと思います。

CSSとHTMLのレイアウト崩れに関する質問です。
サイドバーが下にずれてしまう原因として考えられるのは、
ブロック内にある、複数のブロックの幅の合計値が、親ブロックより大きくなってしまうからだと理解しています。
下のURLのブログは、突然サイドバーが下にずれるようになりました。
http://ameblo.jp/life-in-prague/

ためしにChromeのデベロッパーツールで、両サイドバーのウィジェットをひとつひとつ消してみたり、
skinContentsArea(サイドバーとメインコンテンツのラッパーの親ブロック)の幅を広くし...続きを読む

Aベストアンサー

アメーバブログでどこまでの情報をいじれるのかは知らないので、とりあえずずれる理由だけを。

現在のhtml構造は、
<body>
...
<div class="skinContentsArea">
 <div class="skinContentsArea2">
  <div class="layoutContentsA">...</div> # ←中央&右サイドバー
 </div>
 <div class="layoutContentsB">...</div> # ←左サイドバー
</div>
...
</body>
となっています。

レイアウトがくずれている理由は
メインコンテンツ(layoutContentsA)でfloat:rightで右寄せを行い、
その後メインコンテンツを包含しているラッパー(skinContentsArea2)のafter要素でclear:bothで寄せ指令を解除し、
サイドバー(layoutContentsB)でfloat:leftで左寄せを行っているからです。

解決方法としては2つあり、
1つ目はclear:bothで寄せ指令を解除する前に左サイトバーを入れること。
具体的には
<div class="skinContentsArea">
 <div class="skinContentsArea2">
  <div class="layoutContentsA">...</div> # ←中央&右サイドバー
  <div class="layoutContentsB">...</div> # ←左サイドバー
 </div>
</div>
とする。

2つ目はラッパー(skinContentsArea2)のafter要素でclear:bothを削除すること。
これはblog.1.009.cssに記述されているようです。

アメーバブログでどこまでの情報をいじれるのかは知らないので、とりあえずずれる理由だけを。

現在のhtml構造は、
<body>
...
<div class="skinContentsArea">
 <div class="skinContentsArea2">
  <div class="layoutContentsA">...</div> # ←中央&右サイドバー
 </div>
 <div class="layoutContentsB">...</div> # ←左サイドバー
</div>
...
</body>
となっています。

レイアウトがくずれている理由は
メインコンテンツ(layoutContentsA)でfloat:rightで右寄せを行い、
その後メインコンテンツを...続きを読む


人気Q&Aランキング