HTML: Wie kann ich Text neben mein Video positionieren?

Hallo,

ich habe noch einmal eine Frage. Wie schaffe ich es, dass ein Text in HTML neben meinem Video ist?

Bisher habe ich das:

<video width="420" height="280" controls>
  <source src="katzenvideo.mp4" type="video/mp4">
</video>
<p style="float: right;">Hier ist dann der Text der neben dem Video erscheinen soll und nicht darunter.</p>
<div style="clear: both;"></div>

Jetzt ist der Text allerdings zu weit rechts. Ich hätte gerne, dass der direkt neben dem Video ist.

Was muss ich ändern? Kennt jemand den Code?

Danke im Voraus. :)

1 Antwort

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

Computer, HTML, programmieren

23.03.2022, 11:27

Schreibe ihn einfach daneben und lass den float-Style weg.

<p>
  <!-- video -->
  Hier ist dann der Text der neben dem Video erscheinen soll und nicht darunter.
</p>

Um noch einen Abstand zwischen Video und Text zu schaffen, kannst du einen Außenabstand für das Video definieren:

<video style="margin-right: 10px" ...>

Wenn der Text an der oberen Kante des Videos anfangen soll, klappt das mit diesem Style:

<video style="float: left; margin-right: 10px" ...>

Happycattt

Beitragsersteller

23.03.2022, 11:42

aaah perfekt danke!

Ähnliche Beiträge

Wie ein Text neben einem Bild setzten bei VS Code mit Html?

Hi. Ich möchte mir eine Webseite erstellen und bin dran und ha noch mein eigenes Logo gestaltet für meine Webseite. Ich hab mein Logo schon in die Webseite gesetzt wo ich sie haben möchte aber neben dem Bild möchte ich auch noch den Titel haben.

Und wie kann ich den Titel bei Html neben den Text setzen?

...zum Beitrag

Ein Video in einem HTML Projekt positionieren?

Hey, meine frage ist es, ob man in einem HTML-Projekt, ohne eine CSS-Datei, ein Video genau zu positionieren. Wie zum Beispiel in diesem Bild.

...zum Beitrag

Wie kann ich einen Text in JavaScript positionieren?

Moin, ich möchte die einzelnen Wörter in JS bewegen, wie geht das?

JS-Code:

var footer = `

<h2> Service-Hotline </h2>

<h2> Quellen </h2>

<h2> Anfahrt </h2>

<p></p>

<h1><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"> Quellenverzeichnis </a></h1>

<h1><a href="https://www.google.de/maps/place/Heischberg+6,+24329+Dannau/@54.2467622,10.5792516,17z/data=!3m1!4b1!4m5!3m4!1s0x47b263e46411918d:0xc44a9eacc772c79d!8m2!3d54.24676!4d10.5807992"> Karte </a></h1>

document.getElementsByTagName("footer")[0].innerHTML = footer;

...zum Beitrag

HTML Code Website Sternebewertung ändern?

Hallo,

ich habe aus dem Netz einen HTML Code (siehe Bild) für ein Sternebewertungssystem. Bei meiner Jimdo Webseite habe ich diesen eingefügt.

Ich habe von Programmieren aber keine Ahnung. Der HTML Text enthält eine Verlinkung zu der Seite wo ich den Text herhabe. Natürlich wirkt das nicht sehr seriös. Kann man diese Verlinkung wegmachen?

Wenn nicht, gibt es eine andere Möglichkeit irgendwie so ein Bewertungssystem zu bekommen?

Vielen Dank und liebe Grüße.

...zum Beitrag

HTML/CSS: Wie kann ich diesem Slider einen Text hinzufügen?

Hi,

würde gerne bei diesem Slider: https://codepen.io/valaxin/pen/jmEBL

Text (mit Überschrift) an die rechte Seite stellen, der sich mit jedem Bild ändert. Wie muss ich den Code dafür ändern?

...zum Beitrag

HTML Texte nebeneinander positionieren?

Ich erstelle zum ersten mal eine Website und bisher ging auch alles gut. Aber jetzt will ich zwei Texte nebeneinander haben. Aber wirklich etwas längere Texte, nicht nur eine Zeile oder so.

Dazu erstellt man doch eigentlich Container (mit div) oder? Ich dachte, dann richtet man den einen einfach nach rechts aus und schon geht das. Stimmt das? Geht das auch einfacher?

Und wie lautet dann der genaue Code/Quelltext?

...zum Beitrag

HTML Code übersetzer?

Hallo ich bin gerade am umschreiben einer Website für einen Kumpel, kann auch ein wenig HTML/CSS.

Wisst ihr ob ich per Code den Text dort drin übersetzen lassen kann?

Wenn ja wie?

Besten Dank :D

...zum Beitrag

Dark-Mode White-Mode Schalter Position verschieben?

Guten Abend, ich benötige Hilfe bei einer Website, die ich derzeit programmiere. Ich versuche einen "Dark-Mode" An-Aus Schalter hinzuzufügen. Dabei stoße ich derzeit auf ein Problem: Ich würde den betreffenden 'Knopf' zum ändern der Hintergrundfarbe gerne an den oberen, rechten Seitenrand verschieben, jedoch finde ich nicht den richtigen Befehl an der richtigen Stelle dazu. Ihr kennt euch sicherlich besser mit so etwas aus. Vielen Dank schon mal im Voraus.

(Entschuldigung für die fehlende Formatierung, die Nachricht hätte sonst zu viele Zeichen) + (CSS-Datei befindet sich in den Kommentaren)

Hier der Code der HTML-Seite:

<html lang="de">
<head>
<meta charset=utf-8>
<title>Test-Titel(Tab)</title>
<link rel="Stylesheet" href="TestSeite.css">
</head>
<body>

<form>

<!-- LOGO -->

<div class="Logo">

<a href="https://www.google.com/"> <img src="ImpressumsSymbol (sklein).png"> </a>

</div>

<!-- ----- -->

<!-- HIER BEFINDET SICH DIE FRAGE -->

<input id="dark-mode" class="toggle" type="checkbox" name="Dark mode" role="switch" value="on">

<div class="curtain"></div>

<!-- UEBERSCHRIFT -->

<div class="Ueberschrift">

<h1> <b> ÜBERSCHIRFT </b> </h1>

<h2> IMPRESSUM </h2>

</div>

<!-- ----- -->

<!-- BUTTONS -->

<a href="https://www.google.com/" class="btn-flip" data-front="TEXT" data-back="TEXT"></a>

<a href="https://www.google.com/" class="btn-flip" data-front="TEXT" data-back="TEXT"></a>

<a href="https://www.google.com/" class="btn-flip" data-front="TEXT" data-back="TEXT"></a>

<a href="https://www.google.com/" class="btn-flip" data-front="TEXT" data-back="TEXT"></a>

<!-- ----- -->

<!-- KONTAKT -->
<div class="Impressum">

<h2> <u> TEXT </u> </h2>

</div>

<center>

<p>
<strong>
TEXT
</strong>
<br>
TEXT
<br>
TEXT
</p>
<p>
TEXT
<br>
TEXT
</p>

<p> TEXT </p>

</center>
<!-- ----- -->
<!-- IMPRESSUM -->
<div class="Impressum">

<h2> <u> IMPRESSUM </u> </h2>

<h3>TEXT</h3>

<p> TEXT
<br>
TEXT
<br>
TEXT
</p>
<p> TEXT
<br>
TEXT
</p>

<p>
<strong>
TEXT
</strong>
<br>
TEXT
</p>

<h2>TEXT</h2>
<p> TEXT
<br>
TEXT
<br>
TEXT
</p>
<p>
<a href="https://www.google.com/" class="link">TEXT</a>

</p>
<p>
TEXT
</p>

<h3>Haftung für Inhalte</h3>
<p>
TEXT
</p>
<p>
TEXT
</p>

<h3>TEXT</h3>
<p>
TEXT
</p>
<p>
TEXT
</p>

<h3>TEXT</h3>
<p>
TEXT
</p>
<p>
TEXT
</p>

</div>

<!-- ----- -->





</form>

</body>

</html>

...zum Beitrag

Github Readme: Bild neben Text?

Hey Leute,

Könnte mir bitte jemand weiterhelfen und sagen, wie ich bei Github ein oder mehrere Bilder neben einen Text (rechts davon) packen kann?
Mein bisheriger Code sieht so aus (Die Bilder erscheinen dann unter dem Text):

</p>

Es wäre sehr hilfreich:)
Liebe Grüsse

...zum Beitrag

CSS/ HTML Text ist unsichtbar?

Hallo,

ich bin gerade dabei, eine Webseite zu programmieren und bin dabei auf folgendes Problem gestoßen: Ich arbeite derzeit mit 2 Dateien, einer .html (Webseite) und einer .css(Design der Webseite) und auf einmal seh ich meinen Text nicht mehr. Ich habe ein paar Änderungen am Code getroffen und suche nun vergeblich nach dem Fehler. Hier ein Screenshot des Codes:

links HTML/ rechts CSS

Es wäre cool, wenn mir jemand helfen könnte.

Danke schonmal im Vorraus :D

...zum Beitrag

HTML - Wie kriege ich einen Text hinter eine Raute?

Ich habe folgenden HTML-Code, aber kriege den Text nicht nach oben:

------------------------------------------------------

🔷

</div>

<p>

Dieser Text soll <strong>hinter</strong> der Raute beginnen und die zweite Zeile <strong>linksbündig mit der Raute</strong> sein.

</p>

------------------------------------------------------

Der Screenshot dazu vom Handy:

...zum Beitrag

HTML / CSS Wieso lässt sich mein Text nicht zentrieren?

Hier der Code: https://jsfiddle.net/JetztMitte/mL1t3hwn/1/

...zum Beitrag

Html css Zentrieren?

Moin, ich habe in html 4 Bilder. Darunter will ich jeweils einen Block mit Text

Wie man sieht ist ganz rechts der Block direkt unter dem Bild, das habe ich mit margin gemacht. Bei den anderen Blöcken klappt dies nur nicht mehr. Die Bilder und Blöcke sind in keinem Container oder keiner div soweit ich weiß

Danke

...zum Beitrag

Html, textfelder Nebeneinander, Mittig, verschiedene größen und Text funtkioniert nicht?

Ich versuche gerade in Html 2 Textfelder Nebeneindaer zu bekommen das Rechte soll ein Bild haben, In das Linke Text.

Der Code: https://pastebin.com/qScdL5Vs

Die Bilder:

Wenn ich Wenig Reinschreibe:

Wenn ich nichts Reinschreibe:

Wenn ich viel Reinschreibe:

Ich würde mich Wirklich über Hilfe Freuen. Danke :)

...zum Beitrag

Was möchtest Du wissen?

Deine Frage stellen