<img src="/test.png" style="margin-top:20px;margin-left:20px" title="Hello" border="1" height="100" width="110" />
<span style="text-shadow: 1px 1px 17px #347235;margin-left:20px;margin-top:-20px">Test span</span>
画像が表示されているにもかかわらず、画像の右側に "テストスパン"というメッセージがマージン左：20ピクセルで印刷されていますが、マージントップは印刷されません画像の下部に向かってラベルが表示されるので、何でもしてください。画像の上に表示されるように上に表示したいが、ラベルが下に表示されている。マージントップの問題
あなたは右ここでそれを見ることができます：http://jsfiddle.net/AMWjH/
が
あなたはどのように要素の表示を変更するには、垂直-alignプロパティを変更することができます助けてください。私は、画像にvertical-align: topを適用すると、あなたの問題を解決することを考える：
プレビュー：スパンはインライン要素なのでhttp://jsfiddle.net/Wexcode/AMWjH/23/
はまた、マージントップ及びマージン底があなたのspan要素に影響を与えていない理由は、 。これをインラインブロックに変更するか、またはブロックしてこのマージンを適用することができます（ブロックに変更すると、垂直方向に優先します）。
私が集めたものから、イメージの周りにテキストを囲みたいと思っています。あなただけに<img>タグをalign属性を追加する必要があります。
<div style="padding: 20px;">
<img src="/test.png" style="margin-left:20px; margin-right: 20px;" title="Hello" border="1" height="100" width="110" align="left" />
<span style="text-shadow: 1px 1px 17px #347235;">Test span</span>
</div>
私はあなたが求めているものかどうか分からないが、あなたはタイトルは画像の右に行きたいのように聞こえるが、頂部に整列される。質問を理解していますか？これを試してみてください：
HTML：
<div class="titledImage">
<img src="/test.png" title="Hello" width="110" height="100" />
<p>The Title</p>
</div>
CSS：
.titledImage img {
float: left;
}
は、なぜあなたはあなたのコードこの特定の方法を構築していますか？あなたの限界を完全に知らなくても、私はこのようなことを強くお勧めします：（もちろん、インラインスタイルを取り出してスタイルシートに入れてください）。
<div style="height: 140px; width: 150px;">
<p style="text-shadow: 1px 1px 17px #347235; text-align: center;">Test span</p>
<img src="http://ressim.net/upload/dce92a76.png" style="padding:0 20px 20px;" title="Hello" border="1" />
</div>
これで解決できるかどうか教えてください。マージンを使用する理由はありません&負のマージン。この特定のケースでは、マージンやパディングはイメージ上で動作します。原則として、可能であればマイナスのマージンを避け、絶対に必要な場合にのみ使用してください。
こちらがお役に立てば幸いです。