[CSS] Problem mit float und table unter Safari

[Jumble]

Hallo,

ich habe ein Darstellungsproblem mit einer Tabelle neben einem float unter Safari. Hier der vereinfachte Aufbau meines Codes:

HTML:

<div class="meinfloat"><img ...></div>
<ul>
<li>Hier eine kleine Liste</li>
</ul>

<table class="meinetabelle">
<tr><th>bla</th><th>bla</th></tr>
<tr><td>bla</td><td>bla</td></tr>
</table>

CSS:

.meinfloat {
float: right;
width: 200px;
}
.meinetabelle {
margin: 1em auto;
width: 14em;
}

Der float ist hoch genug, um neben den Folgecontainern zu erscheinen.

Unter allen Browsern außer Safari wird die Tabelle neben dem float innerhalb des verbleibenden horizontalen Raumes zentriert, wie es auch sein soll. Nur der Safari zentriert die Tabelle über die gesamte Bildbreite und überdeckt dabei zum Teil den float. Hat jemand dazu einen Workaround oder habe ich bei der Erstellung einen Denkfehler gemacht und alle anderen Browser stellen es falsch dar?

Wäre für schnelle Hilfe dankbar, denn ich stehe etwas auf dem Schlauch...

Grüße
Carsten

[gruenspan]

ich kann Dein Problem leider nicht nachvollziehen, da ich keine Möglichkeit habe auf einem Safari zu testen. Ein Screen wäre also nicht schlecht.

Aber was willst Du eigentlich tun? Soll das ganze auf ein 3-Spalten-Layout hinauslaufen? Wenn ja, warum nimmst du nicht einfach drei Container und floatest diese nebeneinander? Du aber nimmst eine Tabelle, fügst diese am Ende deines HTML-Codes ein um sie dann zwischen den beiden vorherigen Elemente zu positionieren

Aber vielleicht hast Du ja auch was ganz anderes vor.

[Jumble]

Ein komplettes Layout soll das nicht werden, es ist eine Homepage zu einer Ferienwohnung. Das image im float ist ein Grundriss, die Liste sind Merkmale der Wohnung und die Tabelle ist eine Preistabelle. Da es ein Kundenprojekt ist, möchte ich hier keinen Screenshot oder eine URL angeben, ich kann es aber mal mit ASCII-Art versuchen

So soll es aussehen (und sieht es auch auf IE 6&7, Firefox und Opera):

+-------------------------------------------+
|                                           |
| +--------+            +---------------+   |
| |Liste   |            |               |   |
| |        |            |               |   |
| +--------+            |               |   |
|                       |               |   |
|                       | Float         |   |
|                       |               |   |
|      +--------+       |               |   |
|      |Tabelle |       |               |   |
|      +--------+       |               |   |
|                       |               |   |
|                       +---------------+   |
|                                           |
|                                           |
+-------------------------------------------+

Und so sieht es auf dem Safari aus:

+-------------------------------------------+
|                                           |
| +--------+            +---------------+   |
| |Liste   |            |               |   |
| |        |            |               |   |
| +--------+            |               |   |
|                       |               |   |
|                       | Float         |   |
|                       |               |   |
|                +------+-+             |   |
|                |Tabelle |             |   |
|                +------+-+             |   |
|                       |               |   |
|                       +---------------+   |
|                                           |
|                                           |
+-------------------------------------------+

[gruenspan]

Ein komplettes Layout soll das nicht werden, es ist eine Homepage zu einer Ferienwohnung.

Was soll es dann werden? Und was soll das durcheinander mit Div, Liste, und Tabelle? Nimm doch einfach eine Tabelle mit drei Spalten und fertig. In den Spalten kannst Du dann Deine Liste ect. unterbringen.

Oder, wenn Du auf Tabellen verzichten willst, dann floate drei Container nebeneinander.

Ich vermute, das das Problem bei dem rechtsgefloateten Container und der Reihenfolge deines HTML's liegt.

[Jumble]

Wieso durcheinander? Die Reihenfolge im Quelltext ist völlig in Ordnung.
Es soll auch kein dreispaltiges Layout sein, die Tabelle und die Liste sollen untereinander stehen, nur mit anderer Ausrichtung. Die Tabelle soll bei Bedarf auch unter den Float und die Liste rutschen, je nach Listenlänge und Zeichensatz und dann auch wieder zentriert sein. Das geht nunmal nicht mit Tabellenlayouts und ansonsten sind mir diese auch zu unflexibel und "altbacken".

[gruenspan]

Original geschrieben von Jumble
Die Tabelle soll bei Bedarf auch unter den Float und die Liste rutschen, je nach Listenlänge und Zeichensatz und dann auch wieder zentriert sein.