Gunnar Bittersmann: brauch Hilfe beim formatieren von Text

Beitrag lesen

@@suleiman1

Es geht um den Abschnitt "<strong>".

margin-top und margin-bottom wirkt nicht bei display: inline, d.h. Inline-Elemente haben keinen vertikalen Abstand.

Elemente mit display: inline-block aber schon.


body {
	font-family:Arial;
}

Nutzer, die kein Arial auf ihrem System haben, bekommen den Text dann in der Defaultschriftart des Browsers zu sehen. Das ist dann oft eine Serifenschriftart wie Times New Roman.

Wenn du das nicht willst, unbedingt die generische Schriftfamilie angeben, hier sans-serif.

Auf Systemen, die sowohl Arial als auch Helvetica bzw. Neue Helvetica installiert haben, wird man wohl nicht Arial wollen. Die Angabe sollte so aussehen:

body {
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
}

<!doctype html>

<html>

Hier fehlt die Angabe der Sprache des Inhalts (in dem Fall Deutsch). Das sollte so aussehen:

<!DOCTYPE html>
<html lang="de">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

Das kannst du in HTML5 kürzer haben:

<meta charset="utf-8" />
<link href="main.css" rel="stylesheet" type="text/css" />

Die type-Angabe ist überflüssig.

<section id="menubar"><ul>
	<li><a class="menubutton" href="#menu"><img src="menu.png"></a></li>
</ul></section>

Dem img fehlt der Alternativtext. Weder section noch ul/li sind hier gerechtfertigt. Das ist einfach:

<a class="menubutton" href="#menu"><img src="menu.png" alt="zum Menü"></a>
<header><ul>
	<li><h1>Heimat 2.0</h1></li>
</ul><header>

Ebenfalls kein ul/li.

<section id="main">
	<h2>Überschrift</h2>
	<p>Hier entsteht ein Text.</p>
	<strong>Beispiel für einen ... <br>wichtigen Textblock.</strong>
	<p>Noch mehr ..<br>Textblock.</p>
</section>

Für den Hauptinhalt nicht section, sondern main verwenden:

<main id="main">
	<h2>Überschrift</h2>
	<p>Hier entsteht ein Text.</p>
	<strong>Beispiel für einen ... <br>wichtigen Textblock.</strong>
	<p>Noch mehr ..<br>Textblock.</p>
</main>

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory