1
通常のブラウザでこのウェブサイトを正しくフォーマットしましたが、小さな画面用にレイアウトが崩壊すると、行間にスペースができます。どうすればこの問題を解決できますか？コードへスモールスクリーンモードで行間を削除する
リンク：https://codepen.io/MarkHarrison/pen/KvqLbJ
私はそれが適切にページを打破するだろう、と思ったので、私は、コンテナの流体を使用しています。私は間違って何をしていますか？
<div class="container-fluid">
<body data-spy="scroll" data-target=".navbar">
<nav class="navbar navbar-default navbar-fixed-top">
<!--grouping for mobile display-->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavBar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Mark's Bits</a>
</div>
<div class="collapse navbar-collapse" id="myNavBar">
<ul class="nav navbar-nav">
<li><a href="#about" class="slide-section">About</a></li>
<li><a href="#portfolio" class="slide-section">Portfolio</a></li>
<li><a href="#contact" class="slide-section">Contact</a></li>
</ul>
</div>
</nav>
<!--about section-->
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6 abColor"><h1 id="about">About</h1></div>
</div>
<div class="row">
<div class="col-md-3 col-md-offset-3 abColor" id="inline">
<p id="splurg"><br>Front end developer dedicated to making responsive websites across platforms. Experience with project management, teamwork, and many other programming languages. Looking for a developer role.</p>
</div>
<div class="col-md-3 abColor">
<img src="" alt="headshot" class="img-responsive img-circle center-block headshot">
</div>
</div>
<!--end of about section-->
<!--portfolio section-->
<div class="row" id="portfolio">
<div class="col-md-6 col-md-offset-3 portColor"><h1>Portfolio</h1></div>
</div>
<div class="row">
<div class="col-md-3 col-md-offset-3 portColor">
<img src="" class="img-responsive center-block">
<img src="" class="img-responsive center-block">
<img src="" class="img-responsive center-block">
</div>
<div class="col-md-3 portColor">
<img src="" class="img-responsive center-block">
<img src="" class="img-responsive center-block">
<img src="" class="img-responsive center-block">
</div>
</div>
<!-- end of portfolio section-->
<!--contact section-->
<div class="row" id="contact">
<div class="col-md-6 col-md-offset-3 conColor"><h1>Contact<small><br>To contact me please fill in the form</small></h1></div>
</div>
<div class="row">
<div class="col-md-6 col-md-offset-3 conColor formBox">
<form class="center-block text-center">
<div class="form-group">
<input type="text" class="form-control" placeholder="Name">
</div>
<div class="form-group">
<input type="email" class="form-control" placeholder="Email">
</div>
<div class="form-group">
<input type="number" class="form-control" placeholder="Telephone Number">
</div>
<div class="form-group">
<textarea class="form-control" placeholder="Message" rows="3"></textarea>
</div>
<button class="btn btn-default">Send</button>
</form>
</div>
</div>
<!--end on contact section-->
</body>
</div>
小画面向け@mediaは仕事です – Minesh