überschrift und bild in einer zeile (HTML)

folgende frage:

wie bekomme ich es hin das mein bild genau neben der überschrift steht und nochmal rechts von der überschrift also in der gleichen zeile...

Logo ... Überschrift ... Logo

Danke im Vorraus

6 Antworten

Vom Beitragsersteller als hilfreich ausgezeichnet

MaraB

13.06.2012, 17:11

<div style="float:left; width: 80px;">
<img src="test.jpg" width="50px" height="80px">
</div>
<div style="float:left; width: 100px; margin-top: 30px">
<h1>Überschrift</h1>
</div>
<div style="float:left; width: 80px;">
<img src="test.jpg" width="50px" height="80px">
</div>

Elroy7000

13.06.2012, 19:45

Für was sollen die 3 unnötigen divs gut sein? Und warum wird 3 mal nach links gefloatet?

MaraB

13.06.2012, 20:30

@Elroy7000

Ich habe das aus einer Vorlage für ein dreispaltiges Layout so übernommen.

Elroy7000

14.06.2012, 06:18

@MaraB

Dann war das aber eine ganz misserable Vorlage. Bei einem 3-Spalten Layout wird einmal nach rechts und einmal nach links gefloatet.

Und dann stimmt natütlich die Reihenfolge nicht. Weil erst die zwei Bilder und dann die Überschrift kommt.

Die divs sind auch unnötig weil da nichts ist was gruppiert werden muss.

MaraB

15.06.2012, 07:21

@Elroy7000

Bei einem 3-Spalten Layout wird einmal nach rechts und einmal nach links gefloatet.

Das halte ich nicht für eine "Gesetzmäßigkeit" und wie sollte das dann bei einem vierspaltigen Text funktionieren? Und so miserabel finde ich die Vorlage gar nicht. Aber mir reicht es manchmal auch, dass es einfach nur funktioniert.

webpeg

16.06.2012, 21:10

Hallo mach es so, wie Mara es dir ganz toll erklärt hat. nach links wird immer gefloatet, damit man auch mehr divs nebeneinander legen kann. das erste geht ganz nach links, das zweite schließt sich dort an u.s.w. Der Abstand der verschiedenen Divs wird per padding definiert. LG Peggy

Bjoern96

13.06.2012, 17:08

Würde mit float:left funktionieren:

<img id="Logo" style="float:left" /><h1 style="float:left">Überschrift</h1><img id="Logo2">

Elroy7000

Nutzer, der sehr aktiv auf gutefrage ist

im Thema HTML

13.06.2012, 19:42

Das bekommst du mit CSS hin, indem du das eine Bild nach links und das andere nach rechts floatest.

Suchbegriff: CSS float

julirussia

13.06.2012, 16:21

http://www.html-seminar.de/befehlsuebersicht.htm wenn da was steht

Elroy7000

13.06.2012, 19:36

Nein da steht nichts weil man das mit CSS macht und nicht mit HTML.

Ähnliche Beiträge

HTML-Schrift neben Bild zentrieren?

Hallo,

ich möchte eine Überschrift mittig auf einer Webseite zentrieren.

In der linken Ecke ist ein Logo und wenn ich mit align: "Center" die Schrift zentrieren möchte kann ich sie nur zwischen dem rechten Ende des Logos und dem rechten Ende des Bildschirms zentrieren und nicht allgemein mittig.

Ich freue mich über eure Hilfe.

...zum Beitrag

Icon/Logo in obere Zeile bekommen HTML und CSS?

Hey! Ich habe einmal eine Frage, unzwar wie ich das Instagram Logo (Bilder angehangen), in die obere Leiste zu den Punkten wie z.B Über mich, Startseite und Kontakt u.s.w bekomme. HTML und CSS Script ist auch mit angehangen.

...zum Beitrag

Bild taucht nicht auf Website auf was mach ich falsch?

Hi ich habe folgendes Problem mit html5

nehmen wir an meine website heißt website.de

Wenn ich jetzt folgenden code schreibe:

dann klappt das ganze wunderbar LOKAL.

wenn ich aber folgende zeile schreibe:

und natürlich die html speichere und das logo so wie die

html auf den webserver lade, dann erscheint nur der alt text "logo"

d.h. das bild ist nicht zu sehen.

Was mache ich falsch ?

P.S.: ja das logo ist auch im richtigen ordner. es spielt keine rolle ob ich es in den image ordner

meines servers speichere oder direkt in die root.

Vielen Dank im Vorraus !

...zum Beitrag

Html CSS Überschrift ausrichten?

Hallo,

ich habe in einer Zeile sowohl Button, als auch eine Überschrift. Wie kann ich die Button links lassen, die Überschrift aber in die Mitte ziehen? Denke das erklärt schon alles, ansonsten fragen.

Zweite frage:

Wie richte ich das Bild so aus, dass es über die gesamte Webseite reicht? Width 100% hat nicht funktioniert.

...zum Beitrag

Webseite bauen in HTML?

Hallo,

bin Anfänger in HTML. Meine Frage:

Wie sollte eine Webseite grundsätzlich aufgebaut sein?

Kann man sich grundlegend an folgendem Schema orientieren?

Im <header> steht z. B.

one or more heading elements (<h1> - <h6>)
logo or icon
authorship information

...

...zum Beitrag

Bilder auf gleiche Höhe in HTML/CSS?

Hallo,

ich habe nochmal eine Frage zu meiner Website.

Kann mir jemand sagen, wie ich die beiden linken Bilder auf die gleiche Höhe wie das rechte Bild bringen kann? Ich finde bei Google nichts und weiß nicht weiter.

Hier der Ausschnitt meines Codes:

HTML:

<div id="bilder">
  <div id=bild1>
    <img src="bild1.jpg" alt="Wir bei der Arbeit">
  </div>
  <div id=bild2>
    <img src="bild2.jpg" alt="Wir bei der Arbeit">
  </div>
  <div id=bild3>
    <img src="bild3.png" alt="Holzschränke"
  </div>

CSS:

#bild1 {
  display: inline;
  margin-left: 500px;
}

#bild2 {
  display: inline;
  margin-left: 50px;
}

#bild3 {
  display: inline;
  margin-left: 50px;
}

...zum Beitrag

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

Barrierefreie Websiteüberschrift (HTML)?

Hi, ich wollte meiner Website etwas mehr Barrierefreiheit verschaffen und da kam unter anderem der Wunsch eine ordentliche <h1>-Überschrift anstatt dem Logo als Bild einzufügen. Jedoch würde ich das Bild gerne behalten. Meine erste Idee war die <h1>-Überschrift direkt über das Bild zu schreiben und per hidden-Attribut oder CSS-Befehl unsichtbar zu machen, also zu verstecken, aber bringt das überhaupt was oder wird eine versteckte Überschrift von Blindenprogrammen z.B. ignoriert?

Zweite Idee war das Bild zum Kindelement von <h1> zu machen und und den Text auf dem Logo ins alt-Attribut zu schreiben (wie bisher auch), ggf. noch in Klammern "Logo" dahinter zu schreiben.

Welche Idee ist besser bzw. habt ihr bessere/andere Vorschläge?

...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 Tag als Text darstellen?

Hallo. Ich möchte den Tag <h1> nicht als Tag darstellen, sondern als Text. Wie geht das und macht man das in HTML selber oder in CSS?

Hintergrund: Ich versuche gerade eine Seite zu schreiben, wo HTML erklärt wird. Dort gibt es dann einen Satz bzw. Absatz, der wie folgt lautet:

"Die Sprache HTML beschreibt, wie der Browser (oder ein anderes Programm, wie z. B. ein Text-Editor) die Auszeichnungen des Textes zu „verstehen“ hat, nicht, wie er sie dann in der Darstellung umsetzt. So besagt <h1> zwar, dass eine Überschrift folgt, nicht aber, in welcher Schriftgröße oder Schriftschnitt diese darzustellen ist – hier haben sich nur gewisse übliche Standardeinstellungen eingebürgert, die aber nicht Teil der HTML-Spezifikation sind."

Das Problem ist nun, dass im zweiten Satz ab <h1> alles danach als Überschrift groß und fett geschrieben wird (und in einer neuen Zeile), weil er das alles, was danach folgt, als "Überschrift" kennzeichnet bzw. tagt. Das will ich aber nicht. Ich will, dass es als normaler Text dargestellt wird und alles danach auch. Wie genau mache ich das?

...zum Beitrag

HTML - Wie kriege ich den Text in einer Liste linksbündig?

In einer Zeile eines Inhaltsverzeichnisse ist ein rotes Sternchen. Ich hätte gerne, dass der Text rechts daneben linksbündig ist, also nicht verschoben durch den Zeilenumbruch.

Der Text in den anderen Zeilen ist hinter den Nummern einwandfrei linksbündig. Nur sollte die zweite Zeile in Nr. 7 eingerückt sein.

...zum Beitrag

Überschrift in Bild HTML?

Hallo,

wie kriege ich es hin das meine Überschrift (h1) in einem Bild unten links ist?

Danke

...zum Beitrag

Zellen gleich hoch formatieren in Excel?

Hallo Excel-Genies, folgendes:

Ich möchte in Excel in Querformat DinA4 eine Tabelle mit 4 Spalten und 12 Zeilen anlegen. Aufgrund der Überschrift beginnt die eigentliche Tabelle erst ab Zeile 3. Die Tabelle soll 12 Zeilen besitzen und diese Zeilen sollen alle gleich hoch sein, sodass sie bis zum Ende des Blattes reichen. Sprich wenn ich es drucke, müssen 12 Zeilen über das gesamte Blatt gehen (ausgenommen der Überschrift natürlich) Wie kriege ich es nun hin, dass diese 12 Zeilen auch wirklich nur bis zum Ende des Formats reichen?

...zum Beitrag

HTML - Wie zweite Zeile einer Überschrift einrücken?

Ich bekomme im Bild unten nach einem Umbruch die beiden Zeilen nicht linksbündig hin, weil vorne ein Nummerierungssmiley ist.

Kann mir jemand eine Lösung anbieten?

...zum Beitrag

Was möchtest Du wissen?

Deine Frage stellen