2016-05-25 21 views
0

問題はh5テキストがdiv(id = text)内に表示されないことです。もし誰かが助言してくれたら!これを読み、あなたの時間を助けてくれてありがとう!フッターのヘッダーテキストがDiv(Mozilla Firefox)の外に表示されます。 chrome/IEでは問題ありません

<div id="footer"> 
    <div id="instagram"> 
     <div id="text"> 
      <h5>Please follow our <a href="https://www.instagram.com/craftyclams/">instagram</a> for future updates !</h5> 
     </div> 
     <div id="insta-logo"> 
      <div> 
       <a class="whitelink" href="https://www.instagram.com/craftyclams/" id="insta"></a> 
      </div> 
     </div> 
    </div> 
</div> 

CSSコード: div要素が配置されている

enter image description here

enter image description here

+0

テキストdivを表のセルとして表示していますか?また、その要素から上の詰め物を取り除こうとしましたか? – iomv

答えて

0

私が見たものから、あなたのテキストが内部にありますdiv。 https://jsfiddle.net/vfakqg90/

次回は、スクリーンショットではなくCSSを提供してください。私は完全にあなたのCSSを入力しました。

可能であれば、完全なHTMLとCSSを提供してください。詳細はこちらをご覧ください。今のところ、私はあなたのためにまとめたjsfiddleによると問題は見ません。スクリーンショットとして提供したCSSは、以下のとおりです。

div#footer { 
    width: 100%; 
    height: 7%; 
    background: url("footerbg.jpg"); 
    background-size: 100% 100%; 
    min-width: 1380px; 
    background-repeat: no-repeat; 
    } 
div#instagram { 
    width: 80%; 
    height: 100%; 
    margin: 0 auto; 
    display: table; 
    table-layout: fixed; 
    } 
div#instagram div#text { 
    width: 70%; 
    height: 100%; 
    padding-top: 15px; 
    display: table-cell; 
    } 
div#instagram div#text h5 { 
    font-family: BRUX, serif; 
    color: #fff; 
    text-align: center; 
    font-size: 1.7em; 
    } 
h5 a { 
    font-family: BRUX, serif; 
    color: #fff; 
    border-bottom: 3px solid #fff; 
    padding-bottom: 3px; 
    } 
div#instagram div#insta-logo div { 
    width: 100%; 
    height: 100%; 
    padding-top: 30px; 
    } 
#insta { 
    background: url("logo/insta_icon.png"); 
    background-size: 100% 100%; 
    background-repeat: no-repeat; 
    display: block; 
    height: 90%; 
    text-indent: 100%; 
    white-space: nowrap; 
    width: 70%; 
    max-width: 250px; 
    max-height: 250px; 
    } 
関連する問題