2016-03-23 9 views
0

私が今作っているウェブサイトに問題があります。私はブートストラップを使用しています。基本的なブートストラップCSSを使用している特定のページでは、何も整列しません。次のようにブートストラップCSS苦境

私のコードは次のとおりです。 -

<section id="aboutUs"> 
<div class="container">   
<div class="row">          
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">            
     <img style="width: 500px; height: 288.31775700934577px;" src="/media/1010/macbook-front.png?width=500&amp;height=288.31775700934577" alt="" rel="1255" data-id="1255" />              
     <br />           
    </div> 
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">            
     <h3>Passion is what we stand for</h3>      
     <p>Manta Ray bonytail chub. Russian sturgeon yellow tang cichlid creek chub--Siamese fighting fish poacher--sablefish bichir? Bonnetmouth gray eel-catfish luminous hake frogfish rohu, eel tope snake eel clown loach northern squawfish Australian prowfish, wrymouth.</p> 
     <br />             
     <blockquote>              
      <p>Good is the enemy of great</p>Innova Tamashi             
     </blockquote> 
    </div> 
</div>       
<div class="row">          
    <div class="col-lg-12">            
     <hr />          
    </div> 
</div>        
<div class="row">          
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">         
     <h3>Who we are</h3>        
     <p>Enjoy smooth graphics and timeless design with Innova. Elements of different trends are blended into a special mix.</p> 
    </div>        
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> 
     <h3>What we do</h3>          
     <p>Enjoy smooth graphics and timeless design with Innova. Elements of different trends are blended into a special mix.</p> 
    </div>          
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> 
     <h3>Why we do it</h3>          
     <p>Enjoy smooth graphics and timeless design with Innova. Elements of different trends are blended into a special mix.</p> 
    </div> 
</div> 
</div></section> 

問題は、最後の行でのdivのすべてのように、ラインの外に表示されます(「私たちが行うには」、 '私たちは誰が含まれている)ということです見ることができるhere。私は、私が話すことができるものから、すべてが並んでいなければならないので、なぜそれがそれをしているのか理解できません。どんなアイディアですか?

+0

あなたのコードでは、スペース( ' を')改行なしでいっぱいです。これにより、いくつかの行がプッシュダウンされています。 –

答えて

0

そのため、壊れていないスペースのため&nbsp;です。

、現在あなたのページは次のようになりますhttps://jsfiddle.net/7oe5kh9L/57/

これは固定ページです:https://jsfiddle.net/7oe5kh9L/58/

HTML

<div class="row"> 
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> 
    <h3>Who we are</h3> 
    <p>Enjoy smooth graphics and timeless design with Innova. Elements of different trends are blended into a special mix.</p> 
    </div> 

    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> 
    <h3>What we do</h3> 
    <p>Enjoy smooth graphics and timeless design with Innova. Elements of different trends are blended into a special mix.</p> 
    </div> 

    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> 
    <h3>Why we do it</h3> 
    <p>Enjoy smooth graphics and timeless design with Innova. Elements of different trends are blended into a special mix.</p> 
    </div> 
</div> 
+1

その1人の仲間に感謝します。それらを見つけなかった。このサイトはUmbracoにあり、ソースコードビューのWYSIWYGエディタでは というタグは表示されませんでした。HTML LOLのスペースには変換されない空白だけです。ありがとうmatey :)ソート今:) – user2761804

0

あなたがリンクしたサイトを見ると、問題のセクションには&nbsp;という文字が表示されます。これらを削除すると、位置ずれの問題が解決されます。

関連する問題