注目タグ

質問・疑問

トピック詳細

本文中の絵文字がズレる。

本文中の写真に枠を付けたいと思い、CSSを編集しましたが
写真に枠がつくようにはなったのですが、
本文中に使用した「絵文字」がズレるようになりました。
CSSやHTMLをじっくり見ましたが、どこを修正してやればいいのか分からず困っています。
解決法を教えてください。

2012年03月09日 18:13  by kio

コメント一覧 6件中、1~6件表示

  • >標野ゆきさん

    何度もご回答いただきありがとうございました。
    マージンの指定も試みましたが、-2pxではあまり効果なく、
    それ以上に数字を増やすと、私のmacではすぐ隣の文字(文章)が欠けてしまう為、
    今後は極力絵文字を使わないことで解消したいと思います…

    モブログについても、過去フォーラムでは
    border="0" を挿入するかしないかを管理画面で設定できる…とありましたが
    目を皿のようにして探しても私には設定する箇所が見当たりませんでした。
    こちらは諦めて地道に編集で削除します…

    本当にどうもありがとうございました。
    今後も質問をすることがあるかもしれませんが
    その時はまたよろしくお願いいたします。

    2012年03月12日 18:34 by kio

  • シメノは
    携帯から投稿したことがないので
    よく判らないんですよね^^;

    携帯用の管理画面だけは
    PCからでも閲覧できるのですが
    挿入タグの細かな部分までは設定できないようですね。


    絵文字の左右の空白については
    スタイルシートの.emoji の中に左右マージンの指定を書き込んだら
    もしかしたら効果があるかもしれません。

    margin-left:-2px;
    ↑例えばこんな風に。

    でも
    どんなブラウザでも同じように表示されるのかは判りませんし
    ひょっとすると閲覧者さんの環境によってはメチャクチャになっちゃう可能性もあるので、オススメして良いものかどうか、明言す るのは難しいです^^;
    曖昧なお返事でゴメンナサイ。

    ***

    ご自分でも調べてあるようですし
    padding-leftも試してみられたんでしょうね。
    絵文字の表示位置ってむずかしいです><

    2012年03月11日 17:12 by 標野ゆき

  • >標野ゆきさん

    たびたびのご回答、感謝いたします。
    絵文字の表示位置、欲をいえば横幅も修正したいんですが
    (絵文字の左右に余白が入ってしまっているようなのです)
    もうこれ以上は頭が混乱しそうなので今のところは現状で納得するようにしました。

    スタイルシートのimg部分を消去してみました。
    問題がないようなので消去した状態で使いたいと思います。
    ありがとうございました。

    ただ1つ、画像の border="0" につきましては(←勘違いすみませんでした)
    モブログだと以下のようなタグが自動挿入されてしまうみたいです。

    <a href="http://~~~.jpg"><img src=" http://~~~.jpg" alt="" align="left" border="0"></a><br clear="all&qu ot;>

    このままだと私の場合、思ったような表示にならないものですから、
    『alt="" align="left"』と『<br clear=&qu ot;all">』の部分を後から記事編集で消しています。
    これが非常に面倒な作業です。
    こういうのも自動的に入らないような設定は出来ないでしょうか?

    ※トピックのタイトルに関係ない質問ですみません…。

    2012年03月11日 00:38 by kio

  • 絵文字がそれらしい位置に表示されるようになったのなら
    さしあたりのお悩みが解消されたということですよね。良かったです~^^

    ちなみに引用した
    <img src="http://blog-imgs-46-origin.fc2.com/r/k/l/ rklife2/moblog_b6926b7ds.jpg" [太字]border="0"[ /太字]>
    このタグは絵文字じゃなくて掲載しておられた写真のものです。

    写真には罫を撒くようになさってるわけですから
    太字の部分は削除してしまった方が良いような気がします~。

    img{ border:0px none; } も
    試しに削除されてみてプレビューに不具合がないようでしたら
    そのまま削除してしまわれた方が良いんじゃないかしら。

    削除したときのプレビューに不具合があるようなら
    元に戻して知らん顔していたほうが無難かもしれません。
    こういうテンプレートの機嫌って、たまに微妙なことがあるんですよね。

    余計なことを申し上げたばかりに
    混乱されたようでしたら申し訳ありません^^;

    2012年03月10日 23:23 by 標野ゆき

  • >標野ゆきさん
    早々のご回答、ありがとうございます。
    カスタマイズは難しいですね…。
    ご指摘の意味は理解できましたが、
    位置を調整させる為の数値も、絵文字に自動挿入される border="0" も、
    ここからどうしてやればいいのかよく分かりません。
    絵文字は『{vertical-align:middle;}』で何とか縦幅は中央になった感じです。

    スタイルシートの『img{border:0px none; } 』は消せばいいのでしょうか?
    あと、当方はほとんどモブログで画像添付して送信し、
    本文などは後からPCで書き込むようにしているのですが、
    自動挿入される border="0" はその際に消去すればいいんでしょうか?

    2012年03月10日 16:21 by kio

  • .emoji{
    border:0px;
    }
    スタイルシートのこの部分に
    位置を調整するためのデザイン指定を書き込んでみては?

    ただ
    HTMLにもスタイルシートにも
    画像に枠線を巻かないための指示を残したままで
    新しいデザイン指定が追加してある今の状態ではうまく行かない可能性も低くはないかも。

    img{ border:0px none; } <<スタイルシートのコレとか
    <img src="http://blog-imgs-46-origin.fc2.com/r/k/l/ rklife2/moblog_b6926b7ds.jpg" border="0"> <<記事内のコレとか
    矛盾した指示になっちゃってます^^;

    2012年03月09日 22:02 by 標野ゆき