Bootstrap-4, fügen Sie ein Leerzeichen zwischen zwei Karten-decks
Ich versuche, fügen Sie ein Leerzeichen zwischen den beiden Karten-decks. Ich bin mit bootstrap-4 alpha 6. Ich habe keine Ahnung, warum mt-20
auf die zweite Karte auf dem deck es nicht tun. Ich habe versucht, wickeln Sie Sie in Reihen und es zu tun, aber nicht tun, es entweder:
<div>
<div class="container">
<div class="card-deck">
<div class="card text-center">
<div class="card-block">
<h4 class="card-title">Permits</h4>
<p class="card-text">
Apply for parking permit<br />
View existing permit requests<br />
Activate Visitor permits<br />
</p>
</div>
<div class="card-footer">
@Html.ActionLink("Permits", "Index", "Home", new { Area = "Permit" }, new { @class = "btn btn-primary" })
</div>
</div>
<div class="card text-center">
<div class="card-block">
<h4 class="card-title">Vehicles</h4>
<p class="card-text">
View and manage your vehicles
</p>
</div>
<div class="card-footer">
@Html.ActionLink("My Vehicles", "Index", "Vehicle", null, new { @class = "btn btn-primary" })
</div>
</div>
<div class="card text-center">
<div class="card-block">
<h4 class="card-title">Parking Tickets</h4>
<p class="card-text">
View your parking ticket history
</p>
</div>
<div class="card-footer">
@Html.ActionLink("My Tickets", "Index", "ParkingTicket", null, new { @class = "btn btn-primary" })
</div>
</div>
</div>
<div class="card-deck mt-20">
<div class="card text-center">
<div class="card-block">
<h4 class="card-title">Funding Options</h4>
<p class="card-text">
Add credit/debit card<br />
Top up Account<br />
Manage cards
</p>
</div>
<div class="card-footer">
@Html.ActionLink("Funding Options", "Index", "Funding", null, new { @class = "btn btn-primary" })
</div>
</div>
<div class="card text-center">
<div class="card-block">
<h4 class="card-title">Account History</h4>
<p class="card-text">
View all financial transactions on my account
</p>
</div>
<div class="card-footer">
@Html.ActionLink("Account transactions", "Index", "Activity", null, new { @class = "btn btn-primary" })
</div>
</div>
<div class="card text-center">
<div class="card-block">
<h4 class="card-title">User Settings</h4>
<p class="card-text">
Edit personal details<br />
Change top-up settings<br />
Change password
</p>
</div>
<div class="card-footer">
@Html.ActionLink("Personal details", "Update", "Account", null, new { @class = "btn btn-primary" })
</div>
</div>
</div>
</div>
Du musst angemeldet sein, um einen Kommentar abzugeben.
Gibt es keine
mt-20
im Bootstrap 4. Die Bootstrap-4 margin-Klassen sind...m{Seiten}-{Größe}
Wo Größe ist aus 0-5, und die Größe ist ein Teil der Standard-Abstandhalter-Einheit
1rem
Marge
.25rem
.5rem
1rem
1.5rem
3rem
So können Sie
mt-3
,mt-4
,mt-5
etc..http://www.codeply.com/go/29IGJHkqVd
Könnte man einen Zeilenumbruch unter den Karten:
<br />
. Oder vielleicht einen unteren Rand unter diecard-deck
Klasse: