Problem mit "blockquote"

Status
Nicht offen für weitere Antworten.

orffyre

Erfahrenes Mitglied
Hallo werte Forumsgemeinde!

Ich habe voll das nervige Problem mit "blockquote"!

Ich habe in meiner html-Seite:
Code:
blockquote p {
        margin: 15px 30px 0 10px; font-family: "Times New Roman", Times, serif;
        display: block;
        padding-left: 20px;
        border-left: 5px solid #990000;
}

Obwohl hier explizit angegeben wurde, dass er einen durchgezogenen Strich machen soll, der eine rote Farbe hat, macht er mir immer nur so lange einen Randstrich, bis eine Leerzeile in meinem zitierten Text kommt. Danach geht er dann weiter, mit dem roten Strich, wo Text ist und mit keinem, wo kein Text ist.

Wenn ich jetzt folgendes einfüge:

Code:
blockquote {
        margin: 15px 30px 0 10px; font-family: "Times New Roman", Times, serif;
        display: block;
        padding-left: 20px;
        border-left: 5px solid #990000;
}

dann macht er mir zwar den roten Strich und zieht ihn auch durch, sogar bei einer Leerzeile, aber er ignoriert dafür die anderen Attribute (z.B. padding-left, etc...)

Weiss irgendjemand warum?

Ihr dürft das auch gerne mal ausprobieren, die obigen Codestellen einfach in eine style-css einfügen und im html-Text irgendwo mit <blockquote><p>...</p></blockquote> eine Stelle zitieren.

Ich mach jetzt schon seit ein paar Tagen rum, habe aber bisher keine Lösung hinbekommen. Ich bin ratlos. :(

Danke für jede Hilfe!

mfg
orffyre
 
Alles, was ich weiss, ist, es funktioniert mit beiden nicht und ich weiss nicht warum. Meine persönliche Präferenz liegt auf "blockquote p", bei dem anderen ändert sich nämlich die Textart des zitierten Textes nicht mal.

Any ideas!?
 
Keine Ahnung, was da bei Dir falsch läuft, aber bei mir funktioniert das Stylesheet in allen Punkten einwandfrei.

Meine Testumgebung: Win2k, Firefox 1.5.0.6, IE 6.0, Mozilla 1.7.12, Netscape 7.0, Opera 9.01

Das ist mein Quellcode:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title></title>

<style type="text/css">
<!--
blockquote {
        margin: 15px 30px 0 10px; 
        font-family: "Times New Roman", Times, serif;
        padding-left: 20px;
        border-left: 5px solid #990000;
}
-->
</style>

</head>
<body>

<blockquote>
      <p>Ein Textabsatz</p>
      <p>Und noch ein Textabsatz</p>
</blockquote>

</body>
</html>
Und das ist der repräsentative Firefox-Screenshot:
 

Anhänge

  • 26109attachment.png
    26109attachment.png
    14,7 KB · Aufrufe: 16
Naja, wie du sehen kannst, hat sich an der Schriftart nichts geändert! auch das "padding-left" ignoriert er völlig!

Es ist so, dass wenn ich es über "blockquote p" mache, er mir die Schriftart ausgibt, die ich angegeben habe und auch das "padding".

Wenn ich aber "blockquote" ohne "p" angebe, ignoriert er alles, macht aber einen sauberen roten durchgezogenen Strich! (wie in deinem Beispiel)

Das ist ziemlich weird und ich komm nicht dahinter.

Kein Plan. :(
 
Hast du schon mal daran gedacht einfach zwei Regeln mit den zwei Selektoren zu nehmen?
Code:
blockquote {
	padding-left: 1em;
	border-left: solid #f00;
	background-color: #f88;
}
blockquote p {
	font-family: Georgia, sans-serif;
	background-color: #8f8;
}
 
orffyre hat gesagt.:
Naja, wie du sehen kannst, hat sich an der Schriftart nichts geändert! auch das "padding-left" ignoriert er völlig!

Ich weiß ja nicht, ob Du es mit den Augen hast, aber in meinem gestrigen Screenshot ist klar und deutlich die Schriftart "Times New Roman" zu erkennen und der Text besitzt einen Abstand von 20 Pixel zum linken Rahmen.

Zur Verdeutlichung nochmal der Screenshot, diesmal mit einer optischen Unterstützung:
 

Anhänge

  • 26117attachment.png
    26117attachment.png
    14,4 KB · Aufrufe: 19
Hallo orffyre,

die Unterbrechung der Linie ist auf den Wert
margin-top:15px zurückzuführen.

HTML:
blockquote p {
        margin: 15px 30px 0 10px; font-family: "Times New Roman", Times, serif;
        display: block;
        padding-left: 20px;
        border-left: 5px solid #990000;
}

Das Beispiel von michaelsinterface funktioniert bei mir
anstandslos in allen gängigen Browsern (IE, FF, Opera, Netscape);

//edit
@michaelsinterface
Nettes Tool der Screen Ruler
 
Zuletzt bearbeitet:
Status
Nicht offen für weitere Antworten.
Zurück