Html und Css hilfe?
Hallo Leute ich hab ein kleines Problem,
Und zwar möchte ich bei der Webseite die ich für die Schule erstellen muss eine Unterseite mit Shop machen und da habe ich das problem. Ich habe zwei Produktkarten von w3schools abgeschrieben und es funktoniert soweit auch alles jedoch hätte ich die gerne nebeneinander und nicht untereinander wie es grade ist. Kann mir jemand helfen, wenn möglich sogar mir den passenden code schicken ?
2 Antworten
Bei solchen Fragen ist es immer hilfreich und ratsam den aktuellen Quellcode mit anzuhängen. Sprich deinen aktuellen Stand oder den problematischen Quellcode auf Codepen oder ähnliches speicherst und dann hier darauf verlinkst.
In deinem Fall sollte es eigentlich ausreichen, wenn du dem Eltern-Element in dem sich deine Produktkarten befinden die Eigenschaft display: flex zuweist. Beschäftigt dich also mit dem Flex-Model sowie CSS Grid, um Elemente anzuordnen.
HTML:
<div class="container">
<div class="card">...</div>
<div class="card">...</div>
</div>
CSS:
*, *::before, *::after {
box-sizing: border-box;
/* optional */
padding: 0;
margin: 0;
}
.container {
display: flex;
gap: 1em;
}
Ich habe meine Antwort überarbeitet und das Code-Snippet ergänzt, damit es übersichtlicher bleibt und nicht hier in den Kommentaren steht.
Mit gap kannst du den Abstand bestimmen, zusätzlich mit dem Universal-Selektor (*) das box-sizing für alle Elemente auf border-box umgestellt wird. Letzte Anweisung möglichst weit oder ganz am Anfang deines CSS notieren.
Undzwar -> Und zwar.
eine Unterseite mit Shop machen
nur aus Interesse.... du willst doch nicht ein komplettes Shopsystem mit sämtlichen Fallstricken, die sowas mit sich bringt, von Grund auf neu schreiben und die ganzen Fehler mühsam alleine beheben, die du mit Sicherheit dort hinein basteln wirst?
Warum nicht ein fertiges Shopsystem. Da ist bereits die Installation nicht ohne, wenn man sich mit der Materie HTML/CSS und PHP nur rudimentär bis gar nicht auskennt. Einen eigenen Shop auf der Wissensbasis zu schreiben... da kannst du dir auch gleich in den Fuß schiessen.
Sonst bekomme ich 0 punkte wenn ich es nicht selbst mache
Also nebeneinader sind sie jetzt danke aufjedenfall nur sie liegen aufeinander auf hätte halt gerne noch so einen abstand dazwischen muss ich das mit padding machen oder margin ?