Frage an profis

Diskutiere Frage an profis im HTML Forum im Bereich Programmierung; Hallöchen ich bin neu in der HTML Szene und versuch mich zurzeit an einer Seite für unseren Clan. Jetzt zu meiner Frage an die Profis hier. Wir...
R

Razorxd1993

New member
Dabei seit
13.08.2021
Beiträge
1
Hallöchen ich bin neu in der HTML Szene und versuch mich zurzeit an einer Seite für unseren Clan.
Jetzt zu meiner Frage an die Profis hier.

Wir haben eine Streamer Rubrik, dort wollte ich wie auf der hauptseite: kid.clan.rip die videos(twitch frames) anordnen.
Nur leider setzen sich die frames entweder nebeneinander oder wenn ich sie größer mache untereinander.
Ich wollte wie in der Spiele Rubrik die frames anordnen und links/rechts beschreibungen hinzufügen.

Probiert habe ich : <div> <p> <br>
Leider hat davon nix funktioniert

Ich hoffe auf einigermaßen einsteigerfreundliche Tipps und bitte kein beef/troll/flame, wie gesagt ist das mein erster Versuch ^_^
 
basti1012

basti1012

Well-known member
Dabei seit
12.06.2018
Beiträge
138
Probiert habe ich : <div> <p> <br>
Das ist ja nicht viel.
Du solltest uns den ganzen Code zeigen, mit der CSS .
Das, was du vorhast kann man mit Flexbox machen.
Zb
HTML:
<html>
  <head>
    <style>
    *{
  margin:0;
  padding:0;
  border:1px solid black;
}
body{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
#hauptcontainer{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.video_beschreibung{
  display:flex;
    overflow:hidden;
}
.video,.beschreibung{
  display:flex;
  min-width:200px;
  width:50%;
}
.beschreibung {
    font-size: 30px;
    justify-content: center;
}
video:nth-child(2){
  order:2;
}
.video_beschreibung:nth-child(even) video{
order:2;
}
@media only screen and (min-width: 568px) {
  .video_beschreibung{
    flex-direction:column;
  }
}
    </style>
  </head>
<body>
<main id="hauptcontainer">
  <div class="video_beschreibung">
    <video class="video">
      video
    </video>
    <p class="beschreibung">
      Text
    </p>
  </div>
  <div class="video_beschreibung">
    <video class="video">
      video
      </video>
    <p class="beschreibung">
      Text
    </p>
  </div>
  <div class="video_beschreibung">
    <video class="video">
      video
      </video>
    <p class="beschreibung">
      Text
    </p>
  </div>
  <div class="video_beschreibung">
    <video class="video">
      video
      </video>
    <p class="beschreibung">
      Text
    </p>
  </div>
  <div class="video_beschreibung">
    <video class="video">
      video
      </video>
    <p class="beschreibung">
      Text
    </p>
  </div>
  </main>
</body>
  </html>

Hilft dir das jetzt weiter ?
 
Thema:

Frage an profis

Oben