Exponenten bei Browsern unterschiedlich groß

[Genium]

Hallo,

ich möchte eine Tabelle mit Informationen und nebendran ein Bild machen. Das klappt soweit. Außerdem noch ein kleiner Balken unter dem Bild mit dem © des Machers. Das klappt auch.

In der Tabelle sind gibt es Zahlen mit ² und ³. Diese sind aber bei jedem Browser unterschiedlich groß, sodass die Tabelle Höher wird als das Bild. Wenn ich es auf Firefox abstimme, ist es bei Chrome oder IE Höher.

Außerdem ist der Abstand zwischen Bild und © Div unterschiedlich groß. Diesen Abstand würde ich auch gerne weghaben.

Gibt es da eine möglichkeit das zu ändern?

<div style="float: left; width: 250px;">Bild 250*250
<div style="width=250px; background-color: #000; color: #fff; height: 24px; font-size: 10px;">
Bild: NASA
</div>
</div>
<div style="float: left; width: 348px;">
<table style="text-align: left; width: 380px; height: 250px;"
 border="0" cellpadding="2" cellspacing="2">
  <tbody>
    <tr>
      <td>Name</td>
      <td>Jupiter</td>
    </tr>
    <tr>
      <td>Masse</td>
      <td>1,899&nbsp;&middot;&nbsp;10<sup>27</sup>&nbsp;kg</td>
    </tr>
    <tr>
      <td>Temperatur</td>
      <td>165K (= &minus;108&nbsp;&deg;C)</td>
    </tr>
    <tr>
      <td>Mittlere Dichte</td>
      <td>1,326&nbsp;g/cm<sup>3</sup></td>
    </tr>
    <tr>
      <td>Ortsfaktor</td>
      <td>
24,79&nbsp;m/s<sup>2</sup></td>
    </tr>
    <tr>
      <td><span class="st">&Auml;quatordurchmesser</span></td>
      <td>143.000 km</td>
    </tr>
    <tr>
      <td>Umdrehungszeit</td>
      <td>9,84h</td>
    </tr>
    <tr>
      <td>Achsenneigung</td>
      <td>3,1&deg;</td>
    </tr>
    <tr>
      <td>Anzahl der Monde</td>
      <td>66 (Stand: 29. Januar 2012)</td>
    </tr>
  </tbody>
</table>
</div>
<div style="clear: left;"></div>

[bolivien]

Wenn du nur einen Teil des Quellcodes postest, muss man sich selbst ein Beispiel zurechtbasteln.

Es gibt doch bestimmt eine Website, wo das eingebaut ist.

Du schreibst

Wenn ich es auf Firefox abstimme, ist es bei Chrome oder IE Höher.

Warum oder? Gibt es zwei Varianten, die auf FF abgestimmt sind?

Bestimmte Unterschiede gerade zwischen IE und allen anderen Browsern sind teilweise unvermeidlich. Sie sind nun mal von unterschiedlichen Herstellern und benutzen unterschiedliche Programmkerne, um HTML umzusetzen.

Beim IE hilft es manchmal, wenn man einen korrekten DOCTYPE verwendet. Ob der IE den DOCTYPE korrekt erkennt, kann man z.B. daran erkennen, wenn man die Taste F12 drückt. Dann sollte dort beim Dokumentmodus nicht Quirksmodus stehen.

[maggins]

Zitat von Genium

In der Tabelle sind gibt es Zahlen mit ² und ³. Diese sind aber bei jedem Browser unterschiedlich groß, sodass die Tabelle Höher wird als das Bild. Wenn ich es auf Firefox abstimme, ist es bei Chrome oder IE Höher.

Kann nicht nachvollziehen, was du getan hast, als du es auf Firefox abgestimmt hast. Und was dann im IE anders aussah!? Dafür wären mehr Einzelheiten vorteilhaft.

Man kann die Exponenten <sup> direkt mit CSS ansprechen und so ggf. deren Schrift anpassen. Ein Vorschlag wäre eine Einstellung für alle Elemente innerhalb des Bodys und für die Exponeten exra. Also z.B. so:

<style>
body {
 font: normal 10pt arial;
}
sup {
 font-size: 8pt;
}
</style>

Zitat von Genium

Außerdem ist der Abstand zwischen Bild und © Div unterschiedlich groß. Diesen Abstand würde ich auch gerne weghaben.

Wo ist der © Div?