• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

font-size in Prozent

Status
Für weitere Antworten geschlossen.

thuemmy

Aktives Mitglied
Hallo Forum,

ich habe auf der Website Molitor Bedachungen GmbH - Eltville - Startseite im body-Selektor die font-size: 90%. Da mir die Überschriften noch etwas zu groß sind, habe ich mir überlegt, den h1 ..... h7 - Selektoren nochmal einen Prozentwert (geringfügig unter 100%) mitzugeben. Selbst bei 99% ist die Schrift der Überschrift unverhältnissmäßig klein. Wo liegt mein Problem?

Gruß thuemmy

Code:
body {
 background-image: url(../images/bg2.jpg);
 background-repeat: repeat;
 background-color: white;
 font-family: Verdana, Arial, sans-serif;
 font-size: 90%;
}

h1, h2, h3, h4, h5, h6, h7 {
 font-size:99%;
}

.main {
 width:720px;
 margin-left:auto;margin-right:auto;
 margin-top:15px;
 margin-bottom:15px;
 border-width:1px;
 border-style: solid;
 border-color: black;
 background-color: white;
}

#navsite h5 {
 display:none;
}
#navsite ul {
 padding: 3px 0;
 margin-left: 0;
 border-bottom: 1px solid #778;
 font: bold 12px Verdana, sans-serif;
}
#navsite ul li {
 list-style: none;
 margin: 0;
 display: inline;
}
#navsite ul li a {
 padding: 3px 0.5em;
 margin-left: 3px;
 border: 1px solid #778;
 border-bottom: none;
 background: #DDE;
 text-decoration: none;
}
#navsite ul li a:link {
 color: #448;
}
#navsite ul li a:visited {
 color: #667;
}
#navsite ul li a:link:hover, #navsite ul li a:visited:hover {
 color: #000;
 background: #AAE;
 border-color: #227;
}
#navsite ul li a#current {
 background: white;
 border-bottom: 1px solid white;
}

.content {
 width:700px;
 height:100%;
 margin-left:0px;
 margin-right:0px;
 margin-top:0px;
 margin-bottom:0px;
 background-color: white;
 padding:10px;
}
 
Ich würde mal vermuten, das liegt am Runden der Werte. Je kleiner die Schrift in Deinem Browser voreingestellt ist, desto deutlicher das Problem. Letztlich wird der Unterschied bei 9% vielleicht einen Pixel ausmachen.

Übrigens bin ich ein Gegner von Seiten, die die Größe des Fließtextes auf kleiner als 100% oder 1em stellen, weil das die persönlichen, bevorzugten Einstellungen des Users ad absurdum führt. Insbesondere, wenn die Webmaster das eigentlich nur machen, weil sie in ihrem Browser eine für sie zu große Schriftgröße eingestellt haben.
 
Ich glaub, dass ich nun weiß, wo mein Denkfehler war. Ich dachte, dass sich die Prozent-Angabe auf das jeweilige HTML-Tag bezieht. Wenn ich nämlich 100% für die Überschrift angebe, dann scheint sie so groß zu sein, wie der Fließtext, denn ich jetzt wieder in der default-Größe anzeigen lasse.

Da werde ich wohl dann für jeden h-Selektor eine eigene Größe (>100%) angeben müssen.

Gruß thuemmy
 
Wenn du im Body 90% hast und bei h 99% dann sind die Überschriften 89,1%, weil Prozent ne relative Schriftgröße ist (99% von 90% = 89,1%, bleibt also fast unverändert).
100% für h bleiben dann effektiv 90 %.

Besser wäre, wenn du dem Body 100% gibst und den anderen Elementen entsprechend mehr oder weniger.
Aber Achtung: bei verschachtelten Elementen relativiert sich die Schrift wie oben beschrieben, was je nach Anzahl der Elternelemente zu sehr seltsamen, aber korrekten Effekten führen kann.
 
Ich habe es jetzt so gemacht, dass ich im Body keine Schriftgröße angegeben habe, und entsprechend den einzelnen Elementen die Größe angepasst habe.

Gruß thuemmy

P.S. Kann geclosed werden.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben