動画と画像ギャラリーリンクの背後にあるボックスが、応答

Question

だから並んで2枚の絵が、最初の箱入りの画像ですビデオ：パート1 - パート2は、上のビデオの写真、次に右の別の写真、ビューギャラリーを表すテキストを持っています。次に、すべてのビデオに対してこの応答を繰り返します。

私はきれいなボタンが大好きですが、Googleのページのスピードは明らかにそれらを見ることができないと言ったので、私はちょうどテキストにとどまっていました。

Answer 1

あなたのコードはどこですか？これはヘルプサイトであり、「私をウェブサイトにする」サイトではありません。とにかく、ここでそれを行うための一つの方法は次のとおりです。

.container { 
 
    box-sizing:border-box; 
 
    display:flex; 
 
    justify-content:center; 
 
    align-items:center; 
 
    width:100%; 
 
    height:100vh; 
 
} 
 

 
.image { 
 
    box-sizing: border-box; 
 
    min-width:100px; 
 
    min-height:65px; 
 
    margin-right: 20%; 
 
    content:'sadasdasd'; 
 
    
 
    background: url(http://ichef-1.bbci.co.uk/news/976/media/images/83351000/jpg/_83351965_explorer273lincolnshirewoldssouthpicturebynicholassilkstone.jpg); 
 
    background-position: center center; 
 
    background-size: cover; 
 
    
 
} 
 

 
.image2 { 
 
    //position:absolute; 
 
    box-sizing: border-box; 
 
    min-width:100px; 
 
    min-height:65px; 
 
    margin-left: 0 20%; 
 
    content:'sadasdasd'; 
 
    background: url(http://www.telegraph.co.uk/content/dam/Travel/galleries/travel/hubs/thebigpicture/the-big-picture-photography-competition-round-393/Fary-Afshar-xlarge.jpg); 
 
    background-position: center center; 
 
    background-size: cover; 
 
    
 
    
 
}

<div class="container"> 
 
    <div class="image"></div> 
 
    <div class="image2"></div> 
 
</div>