Zum Inhalt springen

In CSS-Datei hinterlegte Schriftgröße wird ignoriert...

Erstellt am 9. November 2005 · 15 Antworten · letzte Antwort am 10. November 2005

Tags: HTML & CSS, Frage

Unbekannter Benutzer ·

Hallo miteinander,

als absoluter Anfänger hab ich eine Frage, bei der ich nicht in der Lage war trotz intensiver Suche im Web und natürlich auch hier im Forum eine Antwort zu finden:

Ich habe auf Basis des Tutorials "Modern Template Building" mir eine kleine Vorlage gebastelt.
Keine große Sache: Header-Grafik, Menü links, Content rechts, unten eine Fusszeile.

Mein Problem:
Die Formatierung übernimmt eine externe CSS-Datei (styles.css), in der ich den <body> Tag wie folgt formatiert habe:

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	text-align: center;
	margin: 0px;
	padding: 0px;
}

Das klappt auch alles soweit ganz gut, nur die Schriftgröße wird komplett ignoriert. Egal ob ich da jetzt z.B. 24px oder xx-large oder sonstwas angebe; Auf meiner Seite ändert sich nix.
Alle anderen Formatierung des Stylesheets werden korrekt angewendet, nur die font-size nicht.
Was mach ich falsch?

Ich bin für jeden Hinweis dankbar!

erzengel · · Beste Antwort

hm das liegt nicht umbedingt am css.

typo3 benutzt ja ein eigenes stylesheet.

tt_content.stdWrap.dataWrap = 
tt_content.noANameTagForFirstRecord = 1 
tt_content.text.20.parseFunc {
nonTypoTagStdWrap.encapsLines.nonWrappedTag > 
nonTypoTagStdWrap.encapsLines.wrapNonWrappedLines = |</br>
nonTypoTagStdWrap.encapsLines.remapTag.p = <br>
} 
tt_content.text.20.parseFunc.stdWrap.HTMLparser = 1

das sollte ganz hilfreich sein, kommt ins template, der <p> tag von typo benutzt ein stylesheet.

Dann solltest du noch cset stylesheet includen.

td { vertical-align: top;
      FONT-FAMILY: arial;
      FONT-SIZE: 9pt;
      COLOR: #31393b;
    }

ul {margin-bottom:0;margin-top:0;margin-left:17;}

Zudem sollte das noch ins css. ul ist noch eine interessante sache, da werden listings nicht so riesig.

MFG Michael

theo ·
dennis79 schrieb

...
Die Formatierung übernimmt eine externe CSS-Datei (styles.css)
...
Was mach ich falsch?

Wie hast Du die Datei denn eingebunden?
Ohne entsprechende Infos kann man nur raten.

Unbekannter Benutzer ·
erzengel schrieb

joa stimmt

main = PAGE
main.typeNum = 0
main.stylesheet= fileadmin/style.css

so kann man stylesheets einbinden!

Das Einbinden ist nicht das Problem, wie gesagt, alle anderen Formatierungen werden ja korrekt angewandt.
Wende ich die "font-size" Angabe direkt auf das <td>-Element in dem sich das Menü befindet an, dann funktionierts auch.
Mich intressiert nur: Warum wird die "font-size"-Angabe beim <body> nicht berücksichtigt.

Unbekannter Benutzer ·
erzengel schrieb

hm das liegt nicht umbedingt am css.

typo3 benutzt ja ein eigenes stylesheet.

tt_content.stdWrap.dataWrap = 
tt_content.noANameTagForFirstRecord = 1 
tt_content.text.20.parseFunc {
nonTypoTagStdWrap.encapsLines.nonWrappedTag > 
nonTypoTagStdWrap.encapsLines.wrapNonWrappedLines = |</br>
nonTypoTagStdWrap.encapsLines.remapTag.p = <br />
} 
tt_content.text.20.parseFunc.stdWrap.HTMLparser = 1

das sollte ganz hilfreich sein, kommt ins template, der <p> tag von typo benutzt ein stylesheet.

Dann solltest du noch cset stylesheet includen.

td { vertical-align: top;
      FONT-FAMILY: arial;
      FONT-SIZE: 9pt;
      COLOR: #31393b;
    }

ul {margin-bottom:0;margin-top:0;margin-left:17;}

Zudem sollte das noch ins css. ul ist noch eine interessante sache, da werden listings nicht so riesig.

MFG Michael

Mir geht's nicht um das rendern von dynamischen Inhalten, sondern z.B. um statische Texte, die bereits in der HTML-Vorlage existieren.

erzengel ·

das geht nicht wegen dem p tag und den stylesheets von typo3.

hatte auch probiert das mit in die vorlage zu nehmen, aber nix da. Du kannst sonst nur mit typoscript das festlegen. aber das ist auch nicht so toll.

MFG Michael

Unbekannter Benutzer ·
erzengel schrieb

das geht nicht wegen dem p tag und den stylesheets von typo3.

Der Text, den ich gerne formatieren möchte, steht nicht innerhalb eines <p> tag.

Naja, aber nichts für ungut, vielen Dank für die Hilfe! Ich werde mich schon durchkämpfen, aller Anfang ist schwer!

Unbekannter Benutzer ·
erzengel schrieb

doch steht er :p , schau dir mal den quellcode an wenn du eine seite aufrufst. 😉

OK, hab ich, dass ist der Quellcode, wie Typo3 ihn erzeugt (Ausschnitt):

...
<body>

  <div id="page">

    <div id="header">
	<img src="fileadmin/templates/gfx/header.jpg" alt="" />
    </div>

    <div id="main">
      <table border="0" cellpadding="0" cellspacing="0">
	<tr>
	  <td colspan="2"><img src="fileadmin/templates/gfx/body_top.jpg" alt="" /></td>
	</tr>
	<tr>
	  <td id="menu1">
            <div class="menu1_level1_act"><a href="index.php?id=2" onfocus="blurLink(this);">Willkommen</a></div>
	    <div class="menu1_level2_no"><a href="index.php?id=19" onfocus="blurLink(this);">unter1</a></div>
            <div class="menu1_level2_no"><a href="index.php?id=18" onfocus="blurLink(this);">unter2</a></div>
            <div class="menu1_level2_no"><a href="index.php?id=17" onfocus="blurLink(this);">unter3</a></div>
            <div class="menu1_level2_no"><a href="index.php?id=16" onfocus="blurLink(this);">unter4</a></div>
            <div class="menu1_level2_no"><a href="index.php?id=15" onfocus="blurLink(this);">unter5</a></div>
            <div class="menu1_level1_no"><a href="index.php?id=3" onfocus="blurLink(this);">News</a></div>
            <div class="menu1_level1_no"><a href="index.php?id=20" onfocus="blurLink(this);">MenuItem_3</a></div>
            <div class="menu1_level1_no"><a href="index.php?id=4" onfocus="blurLink(this);">10c</a></div>
            <div class="menu1_level1_no"><a href="index.php?id=5" onfocus="blurLink(this);">Fotos</a></div>
            <div class="menu1_level1_no"><a href="index.php?id=6" onfocus="blurLink(this);">Forum</a></div>
            <div class="menu1_level1_no"><a href="index.php?id=7" onfocus="blurLink(this);">Gästebuch</a></div>
          </td>
...

Mir geht es um die Menü-Links, also z.B. "Willkommen", "unter1", "unter2", etc.

Ich seh da kein <p> :o

erzengel ·

ja im menü nicht aber da wird <div class="menu1_level1_act">. ich nehme an die klasse ist von dir, und den wrap hast du erstellt. Oder die klasse ist nicht von dir oder fehlt in deinem css.

dann schaumal wie du das css eingebunden hast, und ich glaube trozdem muss man cset stylesheet verwenden.

MFG Michael

Unbekannter Benutzer ·

Die Klassen sind von mir und bestimmen das Aussehen der Links wie z.B. Hintergrund, Rahmen, usw. Die Klassen haben allerdings keinen Einfluss auf die Schriftart oder -größe. Das wird - oder besser gesagt, sollte - durch Angaben beim body geschehen.

erzengel ·

hm scheint ja nicht zu gehen :p.

main.body=<body>
das kannst probiere oder du machst noch ne definition im css mit <td>.

gibt bestimmt 1000 Möglichkeiten in typo. Aber warum es nicht geht weiss ich nicht. typo3 hat wie gesagt eingene formatierungen und da interessiert es ihm anscheind nicht was in body steht, bzw werden die überschrieben.

Wenn du nun:
<body text=..>

<td class="style">
hast, dann wird die formatierung aus style für die zeile genommen, und nicht body.

Unbekannter Benutzer ·

Ja, wie gesagt, wenn ich die Styles für die Zelle, als fürs <td>-Element, angebe, dann funktionierts.
Ich hab nur gerne bei meinen Designs eine globale Defintion für Schriftart und -größe, und gib dann nur an den Stellen, an denen es anders sein soll, es explizit an.
Hm... naja, man kann nicht alles haben.

Vielen Dank für deine Antworten!

mfg
Dennis79

_o3_ ·

hi dennis79
schriftgrösse im body auf font-size:100%; setzen.
dann kannst du allgemein auf td, p, div elemente deine neue schriftgrösse setzen.

bei deinem menu <div class="menulinks"><a href="">bla</a></div>

kannst du deine schriftgrösse wie folgt ändern.

.menulinks a{
  font-size:.875em;
}
SLAng ·

Also wenn mich nicht alles täuscht ist per Spezifikation eine Angabe der Schriftgröße im Body gar nicht erlaubt. Daher wird die auch ignoriert.