line break beeinflusst css Formatierung?

Katweazl

Neues Mitglied
Thread Starter
Dabei seit
18.08.2006
Beiträge
5
Reaktionspunkte
0
Folgendes Problem taucht wiederholt auf, und ich finde keine Lösung: Wenn ich, aus Layoutgründen, line breaks einfüge, verändert sich das Aussehen der darauf folgenden Schrift, zum Beispiel als link formatiert.

Der Linktext wird dann kleiner als im css postuliert angezeigt. Habe schon links in Fliesstexten untergebracht - völlig problemlos - und frage mich echt, wo mein Fehler liegt. Vielleicht kann mal jemand das Brett vor meinem Kopf entfernen...

Hier ein Screenshot:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>...</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="ilona.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="lightbox/lightbox.css" type="text/css" media="screen" />
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

</head>

<body onload="initLightbox()">
<a name="top"></a>

...

      <h2>09.03.2006</h2>
      <p> Vernissage <em>von mir aus</em><br>
        Rede von Matheos Pontikos</p>
      <a href="https://www.macuser.de/forum/images/pdfs/vonmiraus.pdf">PDF-Download</a><br>
      <p> </p>

...

</body>
</html>

Bin über Hilfe EXTREM dankbar, da ich seit zwei Tagen suche und nicht die Bohne weiterkomme.

Hier noch das css, falls das von Interesse ist:
Code:
a:link {
text-decoration: none;
font-family: Century Gothic, Avant Garde, sans-serif;
font-size: 0.8em;
color: #333333;
}

p {
font-family: Century Gothic, Avant Garde, sans-serif;
font-size: 0.8em;
color: #000000;
}

h2 {
font-family: Century Gothic, Avant Garde, sans-serif;
font-size: 1.2em;
color: #999999;
}
 
In dem Code auf dem Bild hast du den Link innerhalb eines Absatzes <p></p> drin
und dieser vererbt ihm quasi schon die Font-size 0.8em. Wenn du dann auf den Link
nochmal 0.8em anwendest, dann hast du sozusagen 0.8em von 0.8em und nicht von
1em wie in dem restlichen Text des Absatzes.
Schreib doch alle Links innerhalb eines <p>-Tags und spar dir so die 0.8em-Angabe der Linkgröße:
HTML:
<h2>09.03.2006</h2>
<p> Vernissage <em>von mir aus</em><br>
        Rede von Matheos Pontikos</p>
<p><a href="https://www.macuser.de/forum/images/pdfs/vonmiraus.pdf">PDF-Download</a></p>
Und das CSS:
HTML:
p {
 font-family: Century Gothic, Avant Garde, sans-serif;
 font-size: 0.8em;
 color: #000000;
 }

a:link {
text-decoration: none;
color: #333333;
}
?

:)
 
Hej miss.moxy,

ganz geil, funktioniert natürlich. Danke dafür!

Aaaaaber: Das ist doch ein workaround? Ist das sauberer code? EDIT: Vor allen Dingen, weil ich ja dann jeden Link, auch die in der Menuleiste, in <p> setzen muss. Oder eine eigene class einrichten? hmmmm, ok, ginge... ;) Und wieso passiert das bei dieser Seite, aber bei anderen nicht? Ich gebe im css IMMER Grössen an, entweder pixel oder eben m...

Verstehe, das 2x 0.8m sich verkleinert. Also, heisst das, dass ein <br> immer die vorhergehende Formatierung beinhaltet?

Drücke ich mich annähernd verständlich aus? :eek:
 
Zuletzt bearbeitet:
Danke! Hab mich nur gefragt, weil das ja eine Doppelung ist... erst <p> und dann a... Hab ich noch nicht machen müssen.

Womit ich wieder beim Problem bin ;) Und dabei, warum es bei dieser Seite auftritt und bei anderen nicht? Wie schon geschrieben, ich gebe immer Schriftgrössen an, und das hat sich noch nie gedoppelt *kratzamkopp*

Würde das gerne verstehen, das macht mich ganz kribbelich!
 
Natürlich, du kannst auch das <p> weglassen und dem <a> wieder 0.8 zuweisen. Nur dann darf es halt nicht irgendwo in einem <p> vorkommen, denn dann hast du wieder das Problem mit 0.8*0.8.


...und das mit <br> ist so, dass <br> ja nur ein Zeilenumbruch ist, aber kein Element. D.h. du kannst dem keine Eigenschaften zuweisen. Das <p> hingegen ist ein Absatz, quasi ein Rahmen um den Text darin.
 
Ja, das verstehe ich. Was ich nicht verstehe, ist, dass mir das noch nicht vorgekommen ist, obwohl ich immer Grössen für alles angebe.

Beispiel :

Code Auszug:

<h1>iHR HABT ES NiCHT ANDERS GEWOLLT</h1>
<p>AUFGRUND DER HOHEN NACHFRAGE:<br>
DER <a href="shop_de.html">KATSU LOVESHOP</a> iST ONLiNE!<br>

SHiRTS, SWEATER UND ACCESSOiRES F&Uuml;R ALLE LiEBHABER EiNES GUTEN WiENER
SCHNiTZELS ODER EiNES LECKEREN KATSU-CURRYS.<br>
UND NAT&Uuml;RLiCH F&Uuml;R ALLE FREUNDE VON KATSU <mi>カツ
</mi>FASHiON &amp; DESiGN.</p>


css Auszug:

a:link {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 24px;
font-weight: normal;
color: #33FF00;
text-decoration: none;
}

a.sidebar:link {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: normal;
color: #33FF00;
text-decoration: none;
}

p {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 16px;
color: #000000;
}
h1 {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 16px;
color: #999999;
text-decoration: none;
font-weight: normal;
}



Der Link ist, wie gewollt, grösser als der Fliesstext. Und er befindet sich im <p>.


:confused::confused::confused:
 
Jaaaaa, genial, danke!

DAS habe ich, ohne es zu wissen, gesucht!!!

dankedankedanke, jetzt bin ich glücklich und habe was gelernt. Cool.
 
Zurück
Oben Unten