楽天モーションウィジェットでサイトのデザインに空白ができてしまう問題をPositionで克服
PR
以前、楽天のモーションウィジェットで隙間が出来てしまうことを書きましたが
その時は、ネガティブマージンを使うか。空白ができても問題ないデザインにすれば良いという結論になりましたが
もっといい方法がありました
うっかりしてましたね、もっと簡単で何の弊害もない方法があったのです
それはpositionを使うこと
imgがwidthが0になっているってことは目に見えない存在だけど
スペースだけはとっているので、そのスペースを分離するにはpositionを使えばOK
img[width="0"] {
position: absolute;
top:0px;
}
positionはabusoluteじゃなくてfixedでもOK
これをCSSに追加すれば、display:none;でインプレッションに影響が出てしまうおそれが無いし
レイアウトも崩れない、それに見た目の邪魔にもならないです
ただ一つ、imgでwidthが0な物は全て対象になります
widthが0なimgはインプレッション用だけでしょうから、基本影響なしかな？
PR
短縮URL:
COMMENT