Hallo zusammen,
ich hoffe ihr könnt mir helfen bei einem kleinen Problemchen. Wahrscheinlich hab ich einfach nen Brett vorm Kopf warum ich es einfach nicht hinbekomme, also folgendes:
Ich habe auf der rechten Seite meiner Homepage mithilfe von row & col-xx-x eine Sidebar gebaut. In meine Sidebar hab ich drei Cards welche ich untereinander anzeigen lasse, soweit klappt alles ohne Probleme, auch das die Sidebar bei kleinen Geräten unter meinen "main" Content rutscht. Dort lasse ich die Cards dann in zwei reihen Anzeigen, also Card A und b Nebeneinander und darunter dann Card C, neben welcher theoretisch noch eine 4. Card angezeigt werden könnte.
Das Problem ist nun das Card B relativ lang ist und dementsprechend links neben ihr Platz verschwendet wird wo ich nun gerne Card C hinsetzen möchte.
Sidebar "normal":
Card A
Card B
Card C
Sidebar "unterm Content":
Card A Card B
Card C
Ich weiß das ich dies mit col-xx-push & col-xx-offset-xx realisieren kann aber verstehe leider das Prinzip dahinter nicht so genau. Nachfolgend der Code aus meiner Sidebar.
<div class="sidebar col-12 col-xl-3">
<div class="row">
<div class="col-6 col-xl-12">
<div class="card bg-blue text-white">
<div class="card-body">
<!-- Card A -->
</div>
</div>
</div>
<div class="col-6 col-xl-12">
<div class="card">
<div class="card-body">
<!-- Card B -->
</div>
</div>
</div>
<div class="col-6 col-xl-12">
<div class="card">
<div class="card-body">
<!-- Card C -->
</div>
</div>
</div>
</div>
</div>Viele Grüße
RealHugo00