2017-05-07 4 views
-3

divの下の出力をCSSで取得するにはどうすればよいですか?あなたがもっとカスタマイズすることができれば、それははるかに多くの助けになるでしょう。ボーダーをdivデザインの下に取得する方法

enter image description here

+1

あなたがこれまでに試してみました何を? – hrust

+0

ようこそstackoverflowへ。特定の問題のコードを提供してください。それはあなたがどれだけ試してみたのかを証明し、他のメンバーがあなたの問題をより良く理解するのを助けるでしょう。その時、あなたは彼らにあなたの問題の文脈を与えます。これらのリンクを確認してください:https://stackoverflow.com/help/mcveおよびhttps://stackoverflow.com/help/how-to-ask –

答えて

0

あなたはフレキシボックスを使用して、このような何か行うことができます:

body { 
 
    padding: 5%; 
 
} 
 

 
.back-div { 
 
    width: 500px; 
 
    height: 200px; 
 
    border: 1px solid black; 
 
    display: flex; 
 
    flex-direction: column; 
 
    align-items: center; 
 
} 
 

 
.blue { 
 
    background: blue; 
 
    width: 400px; 
 
    height: 100px; 
 
    margin-bottom: 100px; 
 
    flex-shrink: 0; 
 
    margin-top: -45px; 
 
    text-align: center; 
 
} 
 

 
.yellow { 
 
    background: yellow; 
 
    width: 400px; 
 
    height: 100px; 
 
    flex-shrink: 0; 
 
    text-align: center; 
 
}
<div class="back-div"> 
 
    <div class="blue"> 
 
    <h1> Text 1</h1> 
 
    </div> 
 

 
    <div class="yellow"> 
 
    <h1> Text 2</h1> 
 
    </div> 
 
</div>

フィドル:https://jsfiddle.net/jdzgsxg4/

関連する問題