XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Zeilenüberlappung bei margin-top mit negativem Wert (http://xhtmlforum.de/showthread.php?t=37192)

c.weber.os 14.10.2005 13:25

Zeilenüberlappung bei margin-top mit negativem Wert
 
Liebe Leute,
ich habe { margin-top:-1em } eingesetzt, um Absätze ohne Leerzeile erzeugen zu können. Im IE gibt es bei der Darstellung keine Probleme, aber in Firefox und Netscape kommt es teilweise zu Überlappungen. Habt ihr Lösungsvorschläge?
Gruß

ulle 14.10.2005 13:31

Code:

p {
    margin: 0;
}


c.weber.os 14.10.2005 13:49

klappt leider nicht; dann habe ich nämlich wieder eine Leerzeile zwischen den Absätzen

fricca 14.10.2005 13:56

Quelltext?

c.weber.os 14.10.2005 18:24

naja, was heißt Quelltext; es handelt sich hier einfach um eine Definition in einer zentralen .css-Datei, die auf entsprechende classes in beliebigen mit dieser Datei verlinkten Quelltexten, welche sich in einer sql-Datenbank befinden, Anwendung findet. Beispiel:
______________________________
p.kurz { margin-top:-1em }
______________________________



FließtextFließtextFließtextFließtextFließtextFließ textFließtext
FließtextFließtextFließtextFließtextFließtextFließ textFließtext</p>
<p class="kurz">NächsterAbsatzNächsterAbsatzNächsterAbsatz
NächsterAbsatzNächsterAbsatzNächsterAbsatzNächster Absatz</p>
______________________________

Hier ist es also nun so, daß im IE "NächsterAbsatz" sauber ohne Leerzeile unter "Fließtext" steht, während im Firefox wie auch bei Netscape gelegentlich(!) die erste Zeile von "NächsterAbsatz" die letzte Zeile von "Fließtext" überlappt.

fricca 14.10.2005 18:38

Zitat:

naja, was heißt Quelltext
Quelltext heißt: poste einen Quelltext, der dein Problem nachvollziehbar macht. Zusammenhanglose Code-Schnipsel genügen dafür nicht.

Negativer margin-top erzeugt eine Überlappung - warum wundert dich das?
Dein Schnipsel lässt nicht erkennen, ob du etwas gegen die unterschiedlichen Default-Randabstände der Browser unternommen hast.
Wenn du nicht weißt, was ich meine, dann benutz die Suchfunktion mit "Universalselektor".

c.weber.os 15.10.2005 02:20

Hallo fricca und die anderen,

nun dann also hier zunächst der Code für die Datei format.css

__________________________________________________ _____
h1 { font-family:Times New Roman; font-size:22pt; font-weight:bold; padding-top:10pt }
h2 { font-family:Times New Roman; font-size:19pt; font-weight:bold; padding-top:8pt }
h3 { font-family:Times New Roman; font-size:16pt; font-weight:bold; padding-top:6pt }
h4 { font-family:Times New Roman; font-size:14pt; font-weight:bold; padding-top:4pt }
h5 { font-family:Times New Roman; font-size:12pt; font-weight:bold; padding-top:2pt }
h6 { font-family:Times New Roman; font-size:10pt; font-weight:bold }
p { font-family:Times New Roman; font-size:12pt; text-indent:30pt }
p.start { text-indent:0pt }
p.start:first-letter { font-family:Courier New; font-size:25pt; font-weight:bold }
p.links { text-indent:0pt }
p.kurz { margin-top:-1em }
p.kurzundklein { margin-top:-1em; font-size: 80% }
p.kleinundlinks { font-size: 80%; text-indent:0pt }
p.kurzkleinlinks { margin-top:-1em; font-size: 80%; text-indent:0pt }
p.lang { margin-top:2em }
p.xlang { margin-top:3em }
a:link { color:#FF0000; }
a:visited { color:#0000FF; font-weight:bold; text-decoration:none }
a:hover { color:#FF00FF; font-weight:bold; text-decoration:none }
a:active { color:#00FF00; font-weight:bold; text-decoration:none }
blockquote { margin-left:100pt }
q { font-style:italic }
em { font-style:italic }
cite { font-style:italic }
strong { font-weight:bold }
*.center { text-align:center; text-indent:0pt }
*.right { text-align:right }
*.small { font-size:80% }
*.large { font-size:120% }
*.xlarge { font-size:140% }
*.underl { text-decoration:underline }
*.undcent { text-align:center; text-decoration:underline }
*.uitrgt { text-align:right; font-style:italic; text-decoration:underline }
*.beleg { text-align:right; font-style:italic }
__________________________________________________ ______

und nun eine html-Datei:

__________________________________________________ ______
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Robert Kurz: Du bist billig, Deutschland</title>
<link rel="stylesheet" type="text/css"
href="format.css">
</head>
<body>
<p class="beleg">erschienen
im Neuen Deutschland

am 30.09.2005</p>
<h2>Robert Kurz</h2>
<h1>DU BIST BILLIG, DEUTSCHLAND</h1>
<p class="start">Der Sozialstaat wird
zerschlagen, die L&ouml;hne sinken, die Armut
steigt, die Angst grassiert, die Wut im Bauch w&auml;chst. Und die
Antwort? Eine mediale Seifenoper-Crew tritt die Mutter aller
PR-Kampagnen los: "Du bist Deutschland". H&ouml;re,
zwangsverpflichteter 1-Euro-Jobber, demn&auml;chst zum Schuhputzer
Degradierter: "Egal, welche Position du hast. Du h&auml;ltst den
Laden zusammen. Du bist der Laden. Du bist 82 Millionen". Und noch eins
drauf: "Du bist Thyssen". Auf den ersten Blick k&ouml;nnte man an
ein Fake des Satire-Magazins "Titanic" glauben. Aber es ist eine
gemeinsame Realsatire von Springer, Burda, Bertelsmann, Spiegel, ARD,
FAZ, Premiere, Focus und weiteren Medienkonzernen, unterst&uuml;tzt
vom Gro&szlig;b&auml;cker Kamps.</p>
<p class="kurz">Die Primitivit&auml;t der
Botschaft verbl&uuml;fft. Sie
h&ouml;rt sich an wie von intellektuellen Bildungsproletariern
f&uuml;r sekund&auml;re Analphabeten verfasst: "Dein Wille ist
wie Feuer unterm Hintern. Er l&auml;sst deinen
Lieblingsst&uuml;rmer schneller laufen und Schumi schneller
fahren...Gib nicht nur auf der Autobahn Gas. Geh runter von der Bremse.
Es gibt keine Geschwindigkeitsbegrenzung auf der Deutschlandbahn". Die
Adressaten sind offenbar j&uuml;ngere m&auml;nnliche
Identit&auml;tsb&uuml;ffel und Krisenverlierer im
fortgeschrittenen Zustand der Unzurechnungsf&auml;higkeit,
gemeingef&auml;hrliche Raser und bierselige Fans mit einem
Schu&szlig; von postmodernem Willen zur Autosuggestion.</p>
<p class="kurz">Nicht nur die
Primitivit&auml;t verbl&uuml;fft, sondern auch
die Schamlosigkeit. Der Sprachgestus erinnert an faschistische
Durchhalteparolen. Da ist sowohl Kalk&uuml;l am Werk als auch die
Panik einer Flucht nach vorn. W&auml;hrend die Deutschland-AG real
&ouml;konomisch abgewickelt wird, soll mitten im Hurrikan des
globalen Krisenkapitalismus die deutsche Volksgemeinschaft als
ideologische Not- und Zwangsgemeinschaft auferstehen.</p>
<p class="kurz">Zwar h&auml;tte es genauso
gut hei&szlig;en k&ouml;nnen:
"Du bist bl&ouml;d". Aber die professionellen Trendscouts kennen
ihre Pappenheimer. Sie haben mitgeschnitten, dass bis weit in die
gesellschaftliche Mitte hinein die Reaktion auf die Globalisierung
deutschnational statt sozial-emanzipatorisch ist. Sie haben von den
Erfolgen der NPD-Kampagne
"La&szlig; dich nicht einmachen", der "Heuschrecken"-Brandrede von
M&uuml;ntefering und der "Fremdarbeiter"-Hetze von Lafontaine
gelernt. Jetzt wollen die Konzerne selber mitz&uuml;ndeln und
rechts &uuml;berholen. "Du bist Thyssen", das soll auch
hei&szlig;en: "Thyssen ist du". Was die Philosophin Hannah Arendt
als Reaktion "von oben" auf die Weltwirtschaftskrise der
Zwischenkriegszeit beschrieben hatte, wird noch einmal ins Auge
gefasst: Das B&uuml;ndnis der Elite mit dem Mob. Wenn es ans
Eingemachte geht, regredieren auch der Ingenieur und der Studienrat auf
das Niveau eines gr&ouml;lenden Fans.</p>
<p class="kurz">Im Stil einer Sekte wollen die
kapitalistischen Macher aus den
enterbten individualisierten Billigl&ouml;hnern die letzten
Reserven herausleiern: "Du bist wichtig. Bring die beste Leistung, zu
der du f&auml;hig bist". Daf&uuml;r kriegst du zwar kein Geld
mehr, aber du darfst jetzt wieder die Flagge gr&uuml;ssen wie der
beschr&auml;nkteste Pfadfinder. Im Unterschied zu den
Nazi-Propagandisten k&ouml;nnen die
"Du-bist-Deutschland"-Werbetexter allerdings nicht mit Kriegsbeute und
Weltherrschaft winken. Die Globalisierung ist irreversibel, die
transnationale Betriebswirtschaft nicht "heim ins Reich" zu holen.
Trotzdem wird das nationale Ventil ge&ouml;ffnet - nach innen,
nicht nach au&szlig;en. Es ist nicht blo&szlig; die
Aufforderung zur Leistung ohne Lohn: "Machen wir uns die H&auml;nde
schmutzig. Du bist die Hand". Wenn die Zeit der Verzweiflung kommt,
dann geh nicht uns an die Kehle, sondern den Migranten, Asylbewerbern,
hier lebenden Ausl&auml;ndern. Und schuld sind sowieso die Juden.
Das ist der Subtext dieser Botschaft.</p>
</body>
</html>
__________________________________________________ ___________

Was meine Verwunderung über die Überlappung betrifft, so liegt der Grund dafür darin, daß ein Wert von -1em eigentlich nur die standardmäßig eingestellte Leerzeile zwischen zwei Absätzen entfernen sollte, und der IE stellt dies ja auch so da. Eine Überlappung mit der letzten Zeile des vorhergehenden Absatzes sollte doch erst bei einem Wert von -2em passieren.
Was die Sache mit den Default-Randabständen betrifft, so weiß ich tatsächlich nicht, was du meinst; ebenso kenne ich keine Suchfunktion mit Universalselektor.

Gruß

Boris 15.10.2005 02:31

Zitat:

daß ein Wert von -1em eigentlich nur die standardmäßig eingestellte Leerzeile zwischen zwei Absätzen entfernen sollte
Das macht man aber eher so:

p
{
margin: 0;
padding: 0;
}

Und nicht mit negativen Werten ...

fricca 15.10.2005 10:31

Zitat:

Zitat von c.weber.os
ebenso kenne ich keine Suchfunktion mit Universalselektor.

Schaust du hier ganz nach oben - Button: "Suchen"
Sehr nützliche Funktion ;)

Die Einheit pt ist für Bildschirmdarstellung völlig ungeeignet.

c.weber.os 15.10.2005 13:58

@Boris: guter Tip, klappt auch ganz passabel, danke! Allerdings habe ich jetzt teilweise(!) wieder Leerzeilen zwischen den Absätzen, und zwar in allen Browsern. Darüber wundere ich mich ja nach wie vor am meisten, daß innerhalb ein und desselben Dokumentes völlig gleiche Befehle unterschiedlich ausgeführt werden... Gibt es vielleicht doch noch eine weitere Alternative, die auch zuverlässig und gleichbleibend ausgeführt wird?

@fricca: Das kann ich durchaus nachvollziehen, daß pt für die Bildschirmausgabe ungeeignet ist; nur gibt es nach allem, was ich jetzt gelesen habe, keine einzige universal einsetzbare Einheit (mir ist bekannt, daß nicht wenige Besucher der von mir gepflegten Website noch alte Browser wie z.B. Netscape 4.7 benutzen, so daß die Einheit em noch ungeeigneter ist als pt); dann müßte ich wohl unterschiedliche Einheiten für alle möglichen Browser und Ausgabemedien verwenden, und das ist mir im Augenblick einfach much too much...
Ich habe jetzt erst einmal alle Schriftgrößen einheitlich auf pt umgestellt und noch eine Nummer größer gemacht, damit das auf der von dir verlinkten Seite beschriebene Problem bei kleinen Schriften nicht eintritt. Aber mittelfristig werde ich mich sicherlich mit dem Diversifizieren von Definitionen für verschiedene Ausgabemedien und Browser beschäftigen müssen... :roll:

Gruß an alle


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:42 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023