Frage zum Wiki (Tabelle)

[Tilo Baumann]

Ich habe Probleme mit Tabellen: <tab>, <tr>, <td> und den <td>-Attributen valign="top" und align="left". Andere Elemente kenne ich dazu nicht.

Mir gelingt es nicht (zuverlässig), die Datumsangabe darin wie

2011-2017

bei in einer Zeile darzustellen. Stattdessen erhalte ich eine zweizeilige Angabe wie

2011− 2017

Das hat nach meiner Meinung damit zu tun, daß der html-Interpreter nicht weiß, wie lang das Feld sein soll. Bei Feldern wie 2011+2017 geht es.

Ich benutze nur eine ältere Version von Chrome, nämlich Version 48.0.2564.116 . Das Ganze läuft unter einem Linux, dessen Upgrade ich bisher hinausschiebe.

Beim Iceweasel alias FireFox habe ich keine Schwierigkeiten.

Antworten bitte (auch) an meine eMail-Adresse, da ich in diesem Forum nicht zuhause bin.

[bobby]

Moin,

CSS white-space: nowrap; würde den Umbruch verhindern.

Gruß Bobby

[Tilo Baumann]

CSS white-space: nowrap; würde den Umbruch verhindern.

Das erbringt bei mir keine Änderung. Ich verstehe auch nicht, von welchem Blank du redest:

Wenn ich kodiere 2016+2017, wird 2016+2017 geschrieben. Wenn ich aber 2016-2017 kodiere, bricht der Interpreter nach dem — oder − um und schreibt die 2017 in die nächste Zeile.

-> Für jedes Problem gibt es eine Lösung,

Die suche ich.

[bobby]

Moin,

<td style="white-space: nowrap">2016-2017 </td>

Damit wird der Umbruch verhindert und in einer Zeile dargestellt. Hab es über das Dev-Tool diverser Browser direkt bei deiner Webseite getestet.

Gruß Bobby

[Rolf b]

Besser wäre es natürlich, diese Dinge im Style Sheet zu notieren.

<table class="jahresuebersicht">
  <tr>
    <td>2019-2023</td>
    <td>Die Revolution der (insert your group name here)</td>
  </tr>
</table>

.jahresuebersicht{
   border-collapse: separate;
   border-spacing: 1px;
}
.jahresuebersicht td {
   padding: 8px;
   text-align:left;
   vertical-align: top;
}
.jahresuebersicht td:nth-of-type(1) {
   white-space:nowrap
}

Auf diese Weise wird auch die links- und top-bündige Ausrichtung ins Stylesheet verlegt, sowie das cellspacing und cellpadding Attribut der table. Im HTML steht dann nichts mehr, was die Formatierung festlegt, nur noch die Struktur.

Man könnte auch statt einer Table eine Definitionsliste verwenden, das wäre semantisch möglicherweise sinnvoller.

By the way, bist Du sicher, dass deine Frame-Struktur so sinnvoll ist? Du musst alles doppelt notieren; einmal im Frame und einmal im Frameset. Ein Menü neben den Inhalt zu platzieren geht auch anders - ein Tipp dazu wäre das Flexbox-Modell.

Rolf

[Tilo Baumann]

Hallo, bobby,

<td style="white-space: nowrap">2016-2017 </td> Damit wird der Umbruch verhindert und in einer Zeile dargestellt. Hab es über das Dev-Tool > > diverser Browser direkt bei deiner Webseite getestet.

diese Antwort liegt meinem Kenntnisstand am nächsten und scheint das Problem zu lösen! Deine frühere Antwort

CSS white-space: nowrap; würde den Umbruch verhindern.

war auch richtig und meine Reaktion 'Das erbringt bei mir keine Änderung' falsch:

Und ob der Hinweis etwas änderte! Ich merkte es erst später: Alle (betroffenen) Webseiten hatten plötzlich 'unendliche' Zeilenlänge, so daß ich zum Lesen dauernd waagerecht scrollen mußte. Aus Unverständinis hatte ich nämlich deinen Hinweis in meiner css-Datei GLOBAL gesetzt.

Du hast daher jetzt denselben Hinweis zur Verdeutlichung explizit lokal gesetzt und meinem Verständnis damit einen Schub gegeben. Vielen Dank!

Auch den anderen Helfern (Rolf und Gunnar) danke ich. Den lokal gesetzten Stil in die css-Datei aufzunehmen, ist sicherlich sinnvoll, ebenso der Vorschlag, vom System der Frames abzugehen. Das wird allerdings lange dauern, denn der Content frißt mich auf.

Tilo

[Gunnar Bittersmann]

@@Tilo Baumann

2011-2017

Da steht ein falsches Zeichen zwischen den Jahren. Der Bis-Strich ist ein '–' U+2013 Halbgeviertstrich (bei Jahresangaben ohne Leerzeichen davor und danach).

In HTML kannst dafür auch – verwenden: 2011–2017

Stattdessen erhalte ich eine zweizeilige Angabe […] Bei Feldern wie 2011+2017 geht es.

Browserabhängig: Firefox umbricht weder bei '–' noch bei '-' noch bei '+'; Safari und Chrome machen bei '–' und '-' einen Umbruch, bei '+' nicht.

Antworten bitte (auch) an meine eMail-Adresse, da ich in diesem Forum nicht zuhause bin.

Nein. Fragen werden grundsätzlich hier im Forum beantwortet. Von den Antworten sollen alle etwas haben.

LLAP 🖖

[Tabellenkalk]

Hallo,

bei Jahresangaben ohne Leerzeichen davor und danach

Das ist mir neu. Seit wann und warum ist das so?

Gruß
Kalk

[Gunnar Bittersmann]

@@Tabellenkalk

bei Jahresangaben ohne Leerzeichen davor und danach

Das ist mir neu. Seit wann und warum ist das so?

Ah ja, da scheiden sich die Geister. Duden sagt so, DIN sagt so.

LLAP 🖖

[Tabellenkalk]

Hallo,

Ah ja, da scheiden sich die Geister. Duden sagt so, DIN sagt so.

Soso!

Gruß
Kalk

[Tilo Baumann]

Da steht ein falsches Zeichen zwischen den Jahren. Der Bis-Strich ist ein '–' U+2013 Halbgeviertstrich > (bei Jahresangaben ohne Leerzeichen davor und danach). In HTML kannst dafür auch &ndash; verwenden: 2011&ndash;2017

Auch bei 2011&ndash;2017 erhalte ich einen unerwünschten Zeilenumbruch.

Browserabhängig: Firefox umbricht weder bei '–' noch bei '-' noch bei '+'; Safari und Chrome machen bei > '–' und '-' einen Umbruch, bei '+' nicht.

Das ist auch meine Erfahrung bei Chrome und Firefox.

2016-2017 kann ich, semantisch verständlich, durch 2016+2017 kodieren. Aber was sollte ich tun bei 2012-2017 tun?

[TS]

Hello,

Das ist auch meine Erfahrung bei Chrome und Firefox.

2016-2017 kann ich, semantisch verständlich, durch 2016+2017 kodieren. Aber was sollte ich tun bei 2012-2017 tun?

Ich habe da bisher immer dieses Beispiel benutzt:
<time id="period1" datetime="2011-04-02/2011-04-04">2nd&ndash;4th April 2011</time>
und für #period1 dann white-space: nowrap; gesetzt.

Liebe Grüße
Tom S.

[Gunnar Bittersmann]

@@TS

Ich habe da bisher immer dieses Beispiel benutzt:
<time id="period1" datetime="2011-04-02/2011-04-04">2nd&ndash;4th April 2011</time>

Das solltest du zukünftig nicht mehr tun; das sieht nicht nach einer gültigen Zeitangabe aus.

Das berichtigte Markup:

<span id="period1">
  <time class="startDate" datetime="2011-04-02">2nd</time>&ndash;<time class="endDate" datetime="2011-04-04">24th April 2011</time>
</span>

Statt class auch gerne property, wenn du RDFa verwendest. Bzw. itemprop, wenn es denn Microdata sein soll.

LLAP 🖖

[TS]

Hello,

mmmh, danke.

Der Nutztextanteil von HTML geht wohl allmählich gegen Null :-O

Liebe Grüße
Tom S.

[bobby]

Moin,

Nein. Es wird nur endlich relativ strikt zwischen Struktur und Aussehen getrennt. HTML beschreibt lediglich eine Struktur.

Gruß Bobby

[TS]

Hello,

Nein. Es wird nur endlich relativ strikt zwischen Struktur und Aussehen getrennt. HTML beschreibt lediglich eine Struktur.

Und was hat das damit zu tun, dass die Strukturangaben gegenüber dem damit strukturierten Content immet mehr werden?

Liebe Grüße
Tom S.

[bobby]

Moin,

Diese werden nicht unbedingt mehr, sondern semantischer!

Gruß Bobby

[Gunnar Bittersmann]

@@bobby

Diese werden nicht unbedingt mehr, sondern semantischer!

Bei semantischer Auszeichnung kann aber schon mehr Markup dazukommen:

<cite property="citation" typeof="MusicComposition">
	“<span property="name"><a property="url" href="http://www.youtube.com/watch?v=oGZ9tVu4Ahs">Like a Rounded Corner</a></span>”
	lyrics by
	<span property="lyricist" typeof="Person">
		<span property="name">Bruce Lawson</span>
	</span>
	to the tune of
	<cite property="citation" typeof="MusicComposition">
		“<span property="name">Rhinestone Cowboy</span>”
		by
		<span property="lyricist composer" typeof="Person">
			<span property="name">Larry Weiss</span>
		</span>
	</cite>
</cite>

(Quelle)

Wobei ich gerade sehe, dass sich ein span wohl sparen lässt:

<cite property="citation" typeof="MusicComposition">
	“<a property="name url" href="http://www.youtube.com/watch?v=oGZ9tVu4Ahs">Like a Rounded Corner</a>”

LLAP 🖖

[TS]

Hello,

unter welchen Suchbegriffen finde ich wo etwas über diese Art der Auszeichnung?
Ist das nun für die maschinelle Auswertung gedacht, odet wozu taugt die feiner granulare Auszeichnung noch?

Liebe Grüße
Tom S.

[Gunnar Bittersmann]

@@TS

unter welchen Suchbegriffen finde ich wo etwas über diese Art der Auszeichnung?

Unter nuqjatlh. ;-) Ansonsten: RDFa, schema.org.

Ist das nun für die maschinelle Auswertung gedacht, odet wozu taugt die feiner granulare Auszeichnung noch?

Ja. Suchmaschinen, aber auch andere Dienste. Bspw. wie ab 27:37 gezeigt (Folien 124—127). Oder Abfragen mit SPARQL.

LLAP 🖖

[Gunnar Bittersmann]

@@Gunnar Bittersmann

Ja. Suchmaschinen

Wobei Google AFAIK nur Microdata und JSON-LD liest, nicht aber RDFa. WTF???

LLAP 🖖

[Christian Kruse]

Hallo Gunnar,

Ja. Suchmaschinen

Wobei Google AFAIK nur Microdata und JSON-LD liest, nicht aber RDFa. WTF???

Nö.

LG,
CK

[Gunnar Bittersmann]

@@Christian Kruse

Wobei Google AFAIK nur Microdata und JSON-LD liest, nicht aber RDFa. WTF???

Nö.

Oh, da haben sie die RDFa-Unterstützung wohl kürzlich endlich hinzugefügt.

LLAP 🖖

[Gunnar Bittersmann]

@@Gunnar Bittersmann

Das berichtigte Markup:

<span id="period1">
  <time class="startDate" datetime="2011-04-02">2nd</time>&ndash;<time class="endDate" datetime="2011-04-04">24th April 2011</time>
</span>

Statt class auch gerne property, wenn du RDFa verwendest. Bzw. itemprop, wenn es denn Microdata sein soll.

Bzw. class="dt-start" / "dt-end" in Microformats2. ("dtstart" / "dtend" im alten Format.)

LLAP 🖖