Wie reagiere ich zwei überlappende Spalten

Hallo Jungs können Sie mir helfen, wie ich ein Design, das ich in Photoshop erstellt. Ich habe col-md-6 verwendet, um zwei Spalten zu bilden. aber das Problem ist, dass das Erstellen von div height etwas größer ist als das andere. Hier ist das Bild, ich spreche Wie reagiere ich zwei überlappende Spalten

<div class="col-md-6" class="white"> 
    <h1>LOGISTIC</h1> 
</div> 
<div class="col-md-6" class="ship"> 
</div> 
<div class="col-md-6" class="black"> 
    <h1>DELIVERY</h1> 
</div> 
<div class="col-md-6" class="pipe">  
</div> 
<div class="col-md-6" class="white"> 
    <h1>STORAGE</h1> 
</div> 
<div class="col-md-6" class="tank"> 
</div>

css

.ship{ 
background: url(../img/resources/ship.png); 
} 

.tank{ 
background: url(../img/resources/tank.png); 
} 

.pipe{ 
background: url(../img/resources/pipe.png); 
}

Bitte Hilfe I Lager sind hier, danke im voraus

Quelle

2016-09-20 jezz

Bitte fügen Sie alle 3 Bilder, die Sie in Ihrem cs beziehen s. Die Höhe dieser Bilder wirkt sich auf die Höhe deiner Divs aus. –

@AdamScharp ja ich habe tatsächlich vergessen hinzuzufügen, nein, es wurde bearbeitet, sorry. – jezz

Das ist ein einzelnes Bild. Bitte schließen Sie ship.png, tank.png und pipe.png als separate Bilder ein. Wenn diese Bild-URLs eine öffentliche Ressource sind, geben Sie einfach die vollständige URL in Ihrem CSS an (für dieses Beispiel). –

Vergewissern Sie sich, dass Sie die height in allen Klassen unten näher ausführen :

.ship{ 
    height: /*set the height of ship.png*/ 
    background-image: url(../img/resources/ship.png); 
} 

.tank{ 
    height: /*set the height of tank.png*/ 
    background-image: url(../img/resources/tank.png); 
} 

.pipe{ 
    height: /*set the height of pipe.png*/ 
    background-image: url(../img/resources/pipe.png); 
}

Quelle

2016-09-20 13:20:42

Wie reagiere ich zwei überlappende Spalten

Antwort

Verwandte Themen