herbalizer: Hat Mozilla doch CSS- Probleme?

Beitrag lesen

Hi!

Das leigt wohl daran, das span als Blockelement so wie div oder p vom Mozilla eine Breite von 100% zugewiesen bekommen. Somit werden Inlineelemente im span mittig ausgerichtet während der span selbst 100% breit ist. Das img hat aber immer eine Breite die sich aus den natürlichen Abmessungen des Bildes ergeben, ist also nicht 100% breit und wird somit richtiger Weise rechts angeordnet, da es als Blockelement gesehen wird. Das gilt auch dann wenn das img als Blockelement im span steht. Das verhalten läst sich ganz gut nachvollziehen wenn man den Elementen ein Border mitgibt.

Du mußt also margin: auto hinzufügen.

Zum probieren:
.formel {
  display: block;
  text-align: center;
  border: 2px solid red;
  margin: auto;
}

<span class="formel">Text</span>
<img src="gonfish.png" alt="" class="formel" />
<span class="formel"><img src="gonfish.png" alt="" class="formel" /></span>
<span class="formel"><img src="gonfish.png" alt="" /></span>

Gruß Herbalizer