0
モバイルビューでコンテナクラスを無効にするにはどうすればよいですか？右下の空白がクロムのモバイルビュー
A
答えて
1
コードに実際に何も閉じていない終了タグがあるようです。 JSFiddleでも、これらのタグは赤で表示されました。
hereのように削除したときに、フッターと著作権の間の空白が消えました。それがあなたが望んでいたかどうかは分かりませんが、一般的に不正なクローズタグを持つことはお勧めできません。
<meta charset="UTF-8">
<title>IDEO</title>
<link href="files/css/style.css" rel="stylesheet" type="text/css">
<link href="files/css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="files/img/head.png" rel="shortcut icon">
<script src="http://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<link href="files/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="http://fontawesome.io/assets/font-awesome/css/font-awesome.css" rel="stylesheet" type="text/css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<body>
<div id="header-container" class="menu-cursor navbar navbar-default navbar-fixed-top">
<p class="menu-logo">Logo</p>
<span style="font-size:30px;cursor:pointer" onclick="openNav()">☰ </span>
</div>
<div id="myNav" class="overlay">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
<div class="overlay-content">
<a href="#" class="active">Home</a>
<a href="#">About</a>
<a href="#">Services</a>
<a href="#">Clients</a>
<a href="#">Contact</a>
<ul class="small-menus">
<li><a href="#">Sample</a><a href="#">Sample</a><a href="#">Sample</a><a href="#">Sample</a><a href="#">Sample</a></li>
</ul>
</div>
</div>
<div class="container-fluid slider-section">
<div class="slider col-lg-8 col-md-8 col-sm-12">
<h1 class="slider-text-typewriting"> <a href="" class="typewrite" data-period="2000" data-type='[ "Sample Text 1", "Sample Text 2", "Sample Text 3", "Sample Text 4" ]'> <span class="wrap"></span> </a> </h1>
<h1 class="slider-text-typewriting"> <a href="" class="typewrite" data-period="2000" data-type='[ "Sample Text 1", "Sample Text 2", "Sample Text 3", "Sample Text 4" ]'> <span class="wrap"></span> </a> </h1>
<h1 class="slider-text-typewriting"> <a href="" class="typewrite" data-period="2000" data-type='[ "Sample Text 1", "Sample Text 2", "Sample Text 3", "Sample Text 4" ]'> <span class="wrap"></span> </a> </h1>
</div>
<div class="col-lg-3 col-md-3 slider-content">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
<p></p>
<p class="HomeHeader-ContactLink"><a href="#">Contact Us</a></p>
</div>
</div>
<ul class="Bands">
<div class="Band ThreeRichTilesBand WithinRowsOfBands">
<div class="container">
<div class="RichTile RichTile--small RichTile--left col-lg-4 col-md-4 col-sm-12">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog.png);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Name</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Sample heading text </a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--small RichTile--left col-lg-4 col-md-4 col-sm-12">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog.png);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Case Study</span><span class="RichTile-TypeSecond">Name</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Sample heading text </a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--small RichTile--left col-lg-4 col-md-4 col-sm-12">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog.png);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">blog</span><span class="RichTile-TypeSecond">Blog Name</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Sample heading text </a></span></h2>
</div>
</div>
</div>
<!--</div>
<div class="container">-->
<div class="RichTile RichTile--small RichTile--left col-lg-4 col-md-4 col-sm-12">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog.png);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 102 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Name</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Sample heading text </a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--small RichTile--left col-lg-4 col-md-4 col-sm-12">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog.png);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 114 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Case Study</span><span class="RichTile-TypeSecond">Name</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Sample heading text </a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--small RichTile--left col-lg-4 col-md-4 col-sm-12">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog.png);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 127 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">blog</span><span class="RichTile-TypeSecond">Blog Name</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Sample heading text </a></span></h2>
</div>
</div>
</div>
</div>
</div>
<div class="Band FeaturedTileBand FeaturedTileBand--left">
<div class="FeaturedTileBand-ImageContainer">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/blog-main.jpg);"></div>
</div>
<div class="FeaturedTileBand-Content">
<div class="Grid">
<div class="FeaturedTileBand-PlaceholderContainer">
<div class="FeaturedTileBand-Placeholder"></div>
</div>
<div class="FeaturedTileBand-MainContainer">
<div class="FeaturedTileBand-Main">
<div class="FeaturedTileBand-MainContent">
<h3 class="FeaturedTileBand-TypesRow">
<span class="FeaturedTileBand-Type">questions</span><!-- react-text: 146 --><!-- /react-text -->
</h3>
<h2 class="FeaturedTileBand-Title"><span><a href="#">Lorem Ipsum is simply dummy text of the printing </a></span></h2>
<div class="FeaturedTileBand-Divider"></div>
<p class="FeaturedTileBand-Dek">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's</p>
<a class="Button" href="#">See our response</a>
</div>
<!-- react-text: 153 --><!-- /react-text -->
</div>
</div>
</div>
</div>
</div>
<div class="container home-four">
<h2>Sample Heading</h2>
<ul>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
<li><i class="fa fa-eject"></i>Sample text</li>
</ul>
</div>
<div class="container home-five">
<div>
<h2>Sample Heading</h2>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="col-lg-4">
<div class="background"></div>
<h2>
<center>Heading Sample Text</center>
</h2>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
</div>
<div class="Band PairTilesBand lightBlue WithinRowsOfBands">
<div class="Grid">
<div class="RichTile RichTile--small RichTile--left">
<div class="RichTile-Content">
<div class="RichTile-MainContainer">
<!-- react-text: 162 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Case Study</span><span class="RichTile-TypeSecond">Names</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Lorem Ipsum is simply dummy text of the printing</a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--medium RichTile--left">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/corporate.jpg);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 175 --><!-- /react-text -->
<h3>Case StudyNames</h3>
<h2 class="RichTile-Title"><span><a href="#">Lorem Ipsum is simply dummy text</a></span></h2>
<p class="more-link float-right"><a href="#">More <i class="fa fa-arrow-right"></i></a></p>
</div>
</div>
</div>
</div>
</div>
<div class="Band ThreeRichTilesBand WithinRowsOfBands">
<div class="Grid">
<div class="RichTile RichTile--small RichTile--left">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/corporate.jpg);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 190 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Case Study</span><span class="RichTile-TypeSecond">Names</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Lorem Ipsum is simply dummy </a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--small RichTile--left">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/corporate.jpg);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 203 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">Case Study </span><span class="RichTile-TypeSecond">Names</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Lorem Ipsum is simply dummy text. </a></span></h2>
</div>
</div>
</div>
<div class="RichTile RichTile--small RichTile--left">
<div class="RichTile-Content">
<div class="RichTile-ImageContainer">
<a href="#">
<div class="SmartImage SmartImage--background" style="background-image:url(files/img/corporate.jpg);"></div>
</a>
</div>
<div class="RichTile-MainContainer">
<!-- react-text: 216 --><!-- /react-text -->
<h3 class="RichTile-TypesRow"><span class="RichTile-Type">blog</span><span class="RichTile-TypeSecond">Names</span></h3>
<h2 class="RichTile-Title"><span><a href="#">Lorem Ipsum is simply dummy text. </a></span></h2>
</div>
</div>
</div>
</div>
</div>
</ul>
<!--FOOTER-->
<link href="https://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css" rel="stylesheet">
<!--footer start from here-->
<footer>
<div class="container">
<div class="row">
<div class="col-md-4 col-sm-6 col-lg-4 footerleft ">
<div class="logofooter"> Logo</div>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley.</p>
<p><i class="fa fa-map-pin"></i> </p>
<p><i class="fa fa-phone"></i> </p>
<p><i class="fa fa-envelope"></i> E-mail : </p>
</div>
<div class="col-md-2 col-sm-6 col-lg-4 paddingtop-bottom">
<h6 class="heading7">GENERAL LINKS</h6>
<ul class="footer-ul">
<li><a href="#"> Career</a></li>
<li><a href="#"> Privacy Policy</a></li>
<li><a href="#"> Terms & Conditions</a></li>
<li><a href="#"> Client Gateway</a></li>
<li><a href="#"> Ranking</a></li>
<li><a href="#"> Case Studies</a></li>
<li><a href="#"> Frequently Ask Questions</a></li>
</ul>
</div>
<div class="col-md-3 col-sm-6 col-lg-4 paddingtop-bottom">
<form action="" method="post">
<div class="input-prepend"><span class="add-on"><i class="icon-envelope"></i></span>
<input type="text" id="" name="" placeholder="[email protected]" class="form-control" style="width:200px;">
</div>
<br />
<input type="submit" class="btn btn-info" value="Subscribe Now!" />
</form>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 paddingtop-bottom">
</div>
<!--footer start from here-->
<!--footer start from here-->
<!--Pulling Awesome Font -->
<div class="copyright">
<div class="container" style="text-align: center;">
<div class="col-md-12">
<ul class="social-network social-circle">
<li><a href="#" class="icoRss" title="Rss"><i class="fa fa-rss"></i></a></li>
<li><a href="#" class="icoFacebook" title="Facebook"><i class="fa fa-facebook"></i></a></li>
<li><a href="#" class="icoTwitter" title="Twitter"><i class="fa fa-twitter"></i></a></li>
<li><a href="#" class="icoGoogle" title="Google +"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#" class="icoLinkedin" title="Linkedin"><i class="fa fa-linkedin"></i></a></li>
</ul>
</div>
</div>
<div class="container" style="text-align: center;">
<div class="col-md-12">
<p>© 2016 -</p>
</div>
</div>
</div>
<script src="files/js/index.js"></script>
<script>
function openNav() {
document.getElementById("myNav").style.height = "100%";
}
function closeNav() {
document.getElementById("myNav").style.height = "0%";
}
</script>
</body>
関連する問題
- 1. モバイルビューのサイトの背景と右下の不要な空白
- 2. モバイルビューの右側にあるブートストラップの空白
- 3. モバイルビューでワードプロセットの右側の空白のフォームを削除する方法
- 4. クロム道場モバイルビュー
- 5. ホバリングアイテムのクロムが空白で点滅
- 6. zkの右の空白
- 7. ページの右側の空白
- 8. videoview右側の空白
- 9. 右側の大きな空白オンスクリーンサイズ767px以下ブートストラップレスポンス
- 10. クロム/クロムリモートデバッグ - 空白ページの検査
- 11. CSSスプライトの下の空白
- 12. フッタの下の空白
- 13. アプリの右側のイオン空白
- 14. フッターの下の空白の空白を削除するには？
- 15. domPDFネストされたテーブルの問題（右下のコーナーの円滑な空白）
- 16. データを開く：クロムのテキスト/プレーンウィンドウが空白になる
- 17. UITableViewの下に空白（空白）スペースを追加します
- 18. jssorスライダの下の空白のトン数
- 19. フッタの下の空白のページ
- 20. フッターの下のブートストラップ3の空白
- 21. Ionic：IOSのwkwebviewの下の空白11
- 22. ブラウザのサイズが変更されたときに右の空白
- 23. 私のウェブページの右側に空白があります
- 24. WebViewのHTMLコンテンツの右側に空白があります
- 25. スクロールビュー内の制約レイアウト下の空白？
- 26. は右に空白を持ち、ブートストラップ
- 27. クロムの新しい縦型タイムラインの空白は何ですか？
- 28. ウェブサイトの右側に大きな空白があります
- 29. ページの右側に空白があります
- 30. CSS右と左と下から空白を削除する方法
のPlsはあなたの質問は何HTMLワーキング –
を追加しますか？この空白が欲しいですか？コードを確認できるサイトへのコードまたはリンクを提供してください。質問をするにはこちらをご覧ください：http://stackoverflow.com/help/how-to-ask –