[AndreasB]

Hallo,

ich komme bei folgendem Problem nicht weiter.
In Firefox 2 wird das PRE nicht genau wie P ausgerichtet, sondern nach links versetzt. In O9 oder IE6 tritt der Effekt nicht auf.

Über einen Hinweis würde ich mich freuen.

So sieht's aus

div.marginalie{
width: 12em;
float: left;
text-align: right;     
}
p{
max-width: 50ex;
margin-left: 14em;
}
pre{
background: gray;
margin-left: 14em;
/* display: table; */ /* Sorgt fuer Hintergrundfarbe bei aus BODY herauslaufendem PRE */
}


<h1>Marginalien</h1>
<div class="marginalie">Marginalie</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
  ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
  ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<pre>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </pre>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
  ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
  ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<div class="marginalie">Marginalie</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
  ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
  ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

[Gumbo]

Das liegt sicherlich an unterschiedlichen Schriftgrößen.

[AndreasB]

Zitat von Gumbo

Das liegt sicherlich an unterschiedlichen Schriftgrößen.

Selbst wenn ich bei allen drei Selektoren "font-size: 1em" eintrage, bleibt der Effekt bestehen.

Im DOM-Inspector wird jedoch tatsächlich eine unterschiedliche gerenderte Schriftgröße für p und pre angezeigt.
Nur erklären kann ich es mir nicht.

Kann denn jemand den Effekt in FF2 reproduzieren?

Ich habe extra um sicherzugehen, dass keine Nutzerstilvorlage als Ursache in Frage kommt, einen FF mit jungfräulichem Profil zum Testen genommen.

[fricca]

Du machst keine Angabe zur Schriftart. Es werden die Default-Werte der Browser verwendet.
Schau dir an, welche Default-Größe dein Browser für Monospace-Schriften einsetzt.

[Gumbo]

Bei mir haben die Absätze eine errechnete Schriftgröße von 16 Pixel, während das „pre“-Element eine errechnete Schriftgröße von 13 Pixel hat. Damit stimmen sie genau den vor mir eingestellten Standardschriftgrößen überein.

[AndreasB]

Zitat von fricca

Du machst keine Angabe zur Schriftart. Es werden die Default-Werte der Browser verwendet.
Schau dir an, welche Default-Größe dein Browser für Monospace-Schriften einsetzt.

Natürlich! Mist, daran hatte ich einfach nicht gedacht. Der Nutzer kann ja für Festbreitenschriften eine separate Größe einstellen.

Danke für Eure Hilfe!

Dann gibt es wohl offenbar keinen Weg um ein hässliche Layout-Markup-DIVs um jede Gruppe vor und nach den Marginalien herum, richtig?

<div class="marginalie">Marginalie</div>
<div>
<p>Lorem ipsum ...</p>
<pre>Lorem ipsum ...</pre>
</div>

Denn eine absolute Schriftgröße für PRE scheidet aus.

Da ist zu überlegen, ob ich einen ganz anderen, aber semantisch sinnvollen Weg den Vorzug gebe:
Alle PREs erhalten als Kind ein CODE.

<pre><code>...</code></pre>

pre { font-family: sans-serif; }
code { font-family: monospace; }