ボディマージンが0pxに設定されたハイライドイメージ展開の問題

ボディマージンが0pxに設定されていると、最初のイメージリンクがページの中央から拡大される理由を知りましょう。 0pxに設定されているかどうかに関わらず、2番目の画像は常に画像の中央から正しく拡大されます。マージンをわずか1pxに設定すると、最初のイメージが正しく展開されます。ボディマージンが0pxに設定されたハイライドイメージ展開の問題

<!DOCTYPE html> 
    <html> 
    <head> 
    <link rel="stylesheet" type="text/css" href="/highslide/highslide.css" /> 
    <script type="text/javascript" src="/highslide/highslide-with-html.js"></script> 
    </head> 
    <body style="margin:0px;"> 
    <a class="highslide" href="/full.png" onclick="return hs.expand(this)"><img src="/thumb.png"></a> 
    <a class="highslide" href="/full.png" onclick="return hs.expand(this)"><img src="/thumb.png"></a> 
    </body> 
    </html>

これは似ていましたが、それでもわかりません。 Highslide: Issues re-shrinking image

ボディーマージン0pxのすぐ隣に画像が表示されないことが判明しました。回避策は、画像またはコンテナを1ピクセル以上離れて配置することです。

出典

2017-03-18 Airman

あなたのCSSとHTMLコードを調べるためにjsFiddleまたはCodePenを用意してください。我々は何もすることはできませんが、まず何かを見ないと推測します。 –

これらのサイトのどちらでもハイスライドプロジェクトをサンドボックスすることは可能ですか？私は見て見ます。 – Airman

jsfiddle.netの** External Sources **タブを使用して、あなたのサイトで使用されている外部ソースを追加することができます。つまり、** highslide-with-html.js **と** highslide .css **。これらのファイルへのリンクを取得するだけです。 –

なぜ起こっているのかは分かりませんが、他の何かをしようとしていない場合、回避策の1つはdivにサムネイルをラップし、少なくとも1ピクセルの余白を入れますそのdiv：

<body style="margin:0px;"> 
    <div style="margin:1px;"> 
      <a class="highslide" href="/full.png" onclick="return hs.expand(this)"><img src="/thumb.png"></a> 
      <a class="highslide" href="/full.png" onclick="return hs.expand(this)"><img src="/thumb.png"></a> 
    </div> 
</body>

出典

2017-03-22 20:32:14 MisterNeutron

ボディマージンが0pxに設定されたハイライドイメージ展開の問題

答えて

関連する問題