1412247644 WordPressを使っているブログ。左寄せで書いています。図を入れると、文字が右側に回ってしまいます。これを避けるために、<div style=”clear:both;></div>を使ってみたのですが、やはり、元のまま、文字が右側に回ったままです。以下、タグをそのままコピー&ペーストします。どうぞ、間違いをご指摘くださいませ。


<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<div style=”clear:both;>サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。</div>

回答の条件
  • 1人1回まで
  • 13歳以上
  • 登録:2014/10/02 20:00:44
  • 終了:2014/10/03 11:54:06

ベストアンサー

id:a-kuma3 No.2

a-kuma3回答回数4445ベストアンサー獲得回数18272014/10/02 22:44:40

ポイント270pt

質問に書かれた clear:both の書き方では、以下の問題があります。

  • ダブルクォートが全角になってる
  • ダブルクォートが閉じられていない


無理矢理入れた &nbsp; を消して、以下のようにしてください。

<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<div style="clear:both;">サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。</div> 

記述を div で括らなくても良いですし、

<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<div style="clear:both;"></div>サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。 

br タグでやる手もあります。

<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<br clear="both">サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。
他1件のコメントを見る
id:torimaki

Kuma3さん
参考にしたウェッブサイトの記述をそのままコピー&ペーストしたため、全角になってしまっていたようです。WordPressの編集画面に直接打ち込むことで、問題を解決することができました。教えていただいた他のタグも試してみました。あ、できますねぇ。コメントのURLの件、承知しました。末筆になりましたが、ありがとうございました。

2014/10/03 11:50:32
id:torimaki

先のコメント、kuma3さんになっていました。a-kuma3さん、でした。重ね重ね、失礼しました。

2014/10/03 11:53:09

その他の回答(1件)

id:Q-A No.1

Q-A回答回数106ベストアンサー獲得回数162014/10/02 20:27:38

ポイント30pt

右に回るのが不満なのはわかるのですが、どうしたいのでしょう?

左に回らせたいのなら、以下のような感じです。
<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" style="float:right"/></a>

最後に「style="float:right"」を入れただけです。

また、ソースに「class="alignleft」とあります。おそらくこれが、図が左による原因です。

クラスはテンプレの設定次第なのでcssのソースを見せていただかないと、確たることは申し上げられませんが、「class="alignright」にしたら、「style="float:right"」は入れなくても同じ効果があるように思います。

id:torimaki

Q-Aさん、ご回答、ありがとうございます。言葉足らずにて、失礼しました。図の右側に回る文字を、図の下に入りたいので、あります。

2014/10/02 21:06:59
id:torimaki

& nbsp;
& nbsp;
& nbsp;
& nbsp;
というふうに、& nbsp;を続けて入れることで、図の右側ではなく、下側に文が入るようになったのですが。ただ、当方のパソコンではイメージ通りになっているものの、スマホで見たばあい、図と文のスペースが空き過ぎになっていまして。ならば...ということで<divstyle=”clear:both;>を試してみた次第です。

id:a-kuma3 No.2

a-kuma3回答回数4445ベストアンサー獲得回数18272014/10/02 22:44:40ここでベストアンサー

ポイント270pt

質問に書かれた clear:both の書き方では、以下の問題があります。

  • ダブルクォートが全角になってる
  • ダブルクォートが閉じられていない


無理矢理入れた &nbsp; を消して、以下のようにしてください。

<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<div style="clear:both;">サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。</div> 

記述を div で括らなくても良いですし、

<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<div style="clear:both;"></div>サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。 

br タグでやる手もあります。

<a href="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56.png"><img class="alignleft wp-image-1194 size-medium" src="http://tsurumaki-office.com/wp/wp-content/uploads/2014/10/8c3c101989a1eccf23cf64c6eb096b56-300x137.png" alt="" width="300" height="137" /></a>

<br clear="both">サーバーコントロールパネルの左側には、「お客さま情報」「サーバー情報とパスワード」…といった項目が並んでいる。5つ目の「運用に便利なツール」の中の「ファイルマネージャ」をクリックする。
他1件のコメントを見る
id:torimaki

Kuma3さん
参考にしたウェッブサイトの記述をそのままコピー&ペーストしたため、全角になってしまっていたようです。WordPressの編集画面に直接打ち込むことで、問題を解決することができました。教えていただいた他のタグも試してみました。あ、できますねぇ。コメントのURLの件、承知しました。末筆になりましたが、ありがとうございました。

2014/10/03 11:50:32
id:torimaki

先のコメント、kuma3さんになっていました。a-kuma3さん、でした。重ね重ね、失礼しました。

2014/10/03 11:53:09
  • id:rouge_2008
    画像挿入時に配置で「左」を選択しているから、imgのclassに「alignleft」が追加されるのだと思いますが・・・
    記事本文の回りこみなしで画像を左に表示したいのでしたら、画像挿入時に配置で「なし」を選択してみてください。
    配置を指定しない場合、通常はどのブログでも左側に表示されます。

    ※投稿済みの記事については、データベースのバックアップを取って、一括置換してから戻すと良いんじゃないかと思います。

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

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

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

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません