2017-08-07 1 views
0

Ich verwende Code aus der Dokumentation, um ein Kartenspaltenlayout zu erstellen, das 3-4 Karten haben wird. Ich beginne mit nur einem. Hier ist mein Code:Bootstrap 4 Kartenspalten Breite

<div class="card-columns"> 
    <div class="card"> 
    <img class="card-img-top img-fluid" src="..." alt="Card image cap"> 
    <div class="card-block"> 
     <h4 class="card-title">Card title that wraps to a new line</h4> 
     <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit 
longer.</p> 
    </div> 
</div> 

Fiddle

Was ich will, ist meine Spalte haben, um die gesamte Breite versehen nehmen. Genau wie in meinem Beispiel, wenn ich die Größe nach rechts verändere, braucht es den ganzen Raum. Ist das möglich?

Dank

Antwort

2

Es ist im Grunde die same issue as explained here. In Bootstrap definiert jeder Breakpoint eine andere Anzahl von Spalten. Deshalb geht es zu 1 Spalte auf kleinen Bildschirmen in der Geige. Also, wenn Sie es immer 1 Spalte ändern möchten, können Sie CSS verwenden, aber dies wird die gesamte Gruppe von Kartenspalten, nicht nur eine einzige Karte.

.card-columns { 
     column-count: 1; 
    } 

https://www.codeply.com/go/PKwviFqstk

Siehe auch: Is there a way to specify different width to columns in CSS3?

Verwandte Themen