Auf der suche nach dem richtigen Code...

[Raphael]

Hi an alle hier!
Ich befinde mich (der Titel deutet es ja irgendwie bereits an:lol:) auf der suche nach dem richtigen Code für

1) Eine Liste wie diese hier: Mit dieser Kombination bin ich leider nicht weiter gekommen:
<ol>Überschrift
<li>Erste Zeile</li>
<li>Dritte Zeile</li>
<li>Dritte Zeile</li>
</ol>

Weiß jenad Rat? :?:

2) Text der ein Bild umfließt

Weiß jemand, wie man so etwas in HTML definiert, bzw. wo ich Infos oder ein kleines Tutorial finden kann? Ein Link wäre superfantastisch, eine konkrete Anleitung natürlich auch...

DANKE und viele Grüße!
Raphael

 

[bodyandsoul]

Also wenn du auf den Quelltext von deinen ersten Link schaust ham die es mit einer Tabelle gelöst. Dein versuch ist auch nicht html valide weil nach <ul> <ol> etc kein normaler text stehn darf! Mit einer liste wäre das glaub ich zu kompliziert ....
Also entweder mit divs oder tabelle

zu 2tens
<img src=" # " alt="#" ALIGN="LEFT" (oder) ALIGN="RIGHT">
Bei LEFT ist das bild links text rechts und bei RIGHT anders rum

genaueres
SELFHTML: HTML/XHTML / Grafiken / Grafiken ausrichten

 

[Raphael]

Hi bas!
Danke für die Tipps! Das mit dem Quelltext ist natürlich richtig. Ist mir bissl peinlich, dass ich vergessen habe nachzusehen! ops
lG
Raphael

 

[neuroleptika]

Mögliche Elemente:
Eine Definitionsliste (<dl>), ungeordnete Liste (<ul>) oder Absätze (<p>).
<table> passt nicht zum Inhalt.

Hier als <dl>:

<dl>
<dt>1.1</dt>
<dd>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</dd>

<dt>1.2</dt>
<dd>
 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</dd>
</dl>

css

* {
    margin: 0;
    padding: 0;
  }

dl {
   background-color: #E1E1E1;
}

dt {
   float: left;
   background-color: #E1E1E1;
}

dd {
  padding-left: 2em;
  border-bottom: 5px solid #fff;
}

Die Breite würde durch das Eltern-Element begrenzt.
Da <dt> nie höher als <dd> ist braucht nicht gecleart werden.

 

[Efchen]

Also, wenn die Frage - weil sie im HTML-Forum steht - auf die richtige Auszeichnung in HTML zielt, dann ist die Auszeichnung eines Menüs mit einer Liste natürlich goldrichtig. Tabellen benutzt man nur bei der Auszeichnung von tabellarischen Daten. Das ist bei einem Menü nicht gegeben, ist also verkehrt. Mit <div> gruppiert man mehrere Elemente zwecks gemeinsamer Positionierung. Liegt hier auch nicht vor, also auch falsch.

Text, der ein Bild umfließt, ist keine HTML-Frage. Da zeichnet man natürlich das Bild mit dem <img>-Tag aus, den Textabsatz mit <p>, hat man mehrere Absätze, die fließen sollen, kann es nötig sein, diese mit <div> zu gruppieren, aber auch nur, wenn alle Absätze am Ende des Bildes nicht wirklich um das Image fließen sollen, sondern gleich weit eingerückt bleiben sollen. Wenn sie wie im Beispiel fließen sollen, dann wird kein <div> benötigt.

Das eigentliche Fließen wird dann mit CSS gelöst, mit Hilfe der Eigenschaft "float". Darüber sollte man sich auch ein bisschen einlesen, weil es den normalen Textfluss verändert, bzw. das gefloatete Element aus dem Textfluss nimmt.

Bei Problemen einfach nochmal nachfragen.

Gruß,
-Efchen