Twiiter Bootstrap Modalが外をクリックすると閉じない

Question

私はブーストラップのエージェンシーテーマを使用していますが、サイズをカスタマイズしましたが、それを外すとブートストラップから通常のモーダルでも閉じることはできませんあなたのコードで

  <p class="buttonp "> <a href="#portfolioModal" class="portfolio-link" data-toggle="modal" data-dismiss="modal"> 
Click for more info </a></p>    
</div> 

           <!-- Portfolio Modal 1 --> 
         <div id="portfolioModal" class="modal fade portfolio-modal" tabindex="-1" role="dialog" aria-labelledby="portfolioModal" aria-hidden="true"> 
          <div class="modal-content"> 
           <!-- <div class="close-modal" data-dismiss="modal"> 
            <div class="lr"> 
             <div class="rl"> 
             </div> 
            </div> 
           </div> --> 
           <div class="container"> 
            <div class="row"> 
             <div class="col-md-5"> 
              <div class="modal-body"> 
               <!-- Project Details Go Here --> 
               <p> Lorem ipsum dolor sit amet, consectetur adip iscing elit. Suspendisse laoreet est nunc. Na </p> 
                        <p> Lorem ipsum dolor sit amet, consectetur adip iscing elit. Suspendisse laoreet est nunc. Na </p> 
       </div> 
             </div> 
            </div> 
           </div> 
          </div> 
         </div> 
         <!-- -->  

Answer 1

の問題です：

1. あなたはBootstrap Modals
にdirectonsあたりとして体内に直接いくつかの他の要素内のモーダルコードを入れていないそのノートは）病気に以下の私のブートストラップモーダルが示します
2. モーダルボディとモーダルコンテンツのサイズを変更して、画面全体を表示しています。モーダルは、スクリーン全体（モーダルバックグラウンドクラス）を占めるレイヤーを持ち、モーダルを表示します。このモーダルバックグラウンドクラスは、クリックを受け取ったときにモーダルを閉じますが、今度はモーダルダイアログでカバーされるので、これを行うことはできません。

私はあなたがいくつかの要素にオーバーレイしたかったかもしれないと思います。見てくださいExample on CodePen

<div class="parent"> 
    <div class="content">Lorem ipsum dolor sit ametLorem ipsum dolor sit ametLorem ipsum dolor sit ametLorem ipsum dolor sit ametLorem ipsum dolor sit ametLorem ipsum dolor sit ametLorem ipsum dolor sit amet</div> 
    <div class="overlay">Flower, Plants, Herbs, Trees.,Flower, Plants, Herbs, Trees,Flower, Plants, Herbs, Trees,Flower, Plants, Herbs, Trees,</div> 
</div> 
.parent{ 
    background:green; 
    position: fixed; 
} 

.content{ 
    background: blue; 
    width: 100px; 
} 

.overlay{ 
    position:absolute; 
    background: red; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
}