前提・実現したいこと
ランディングぺージを作っているのですが、内容がブラウザ画面にフィットせず、
右にスクロールしてしまうと空白部分が出来てしまい、その空白を削除したいのです。
宜しくお願い致します。
該当のソースコード
html
<div class="ichiban-3"> <img class="ac" src="1476268_s_wi/genso.jpg"> </div> <div class="box12-3 distanceHundred12"> <img class="sha4" src="1476268_s_wi/genso1.png"> </div> <div class="box12-4 distanceHundred13"> <img class="sha5" src="1476268_s_wi/genso2.png"> </div>
css
.ichiban-3 {text-align:center; margin :300px 0px;} .ac {width :800px;} .box12-3 { width :100%; text-align:center; position: absolute; top: 4830px; /*ブラウザのウィンドウ基準*/ left: 98px; /*ブラウザのウィンドウ基準*/ background: #00000000; font-weight: bold; padding: 0em; margin: 0 auto; } .sha4 {width :310px;} .box12-4 { width :100%; text-align:center; position: absolute; top: 4863px; /*ブラウザのウィンドウ基準*/ left: -123px; /*ブラウザのウィンドウ基準*/ background: #00000000; font-weight: bold; padding: 0em; margin: 0 auto; } .sha5 {width :262px;}
javascript
<script src="test/js/scrollreveal.js"></script> <script> window.sr = ScrollReveal({ reset: true }); // Distance sr.reveal('.distanceHundred12', { distance: "500px", origin: "right", delay: "600" }); // Distance sr.reveal('.distanceHundred13', { distance: "500px", origin: "left", delay: "1000"}); </script>
試したこと
検証で調べてpadding等を変化させましたが、解決しませんでした。
補足情報(参考URL)
まだ回答がついていません
会員登録して回答してみよう