✔ Alternative zu max-width

[Sprint]

Hallo,

ich soll auf einer Seite eine kleine Laufschrift einbauen. Eigentlich kein großes Problem, nur flippen da die meisten Windows Browser bei aus.

das Div selbst, in dem die Laufschrift erscheint, sieht so aus:

.marquee {
    max-width: 570px;
    overflow: hidden;
    border: 1px solid #c00;
    color: #b0905e;
    font-size: 14px;
    top: 5px;
    position: relative;
}

Das max-width ist drin, damit sich die Breite an einen schmaler werdenden Viewport anpaßt.

Unter Mac Safari, Chrome, FF und Win FF wird das Div auch richtig positioniert. Win Chrome, Opera und Explorer vertragen das max-width hier aber nicht. Erst wenn ich es auf ein einfaches width ändere, wird das div richtig positioniert. Nur verändert es seine Breite natürlich nicht mehr, was auf Smartphones natürlich dämlich aussieht.

Eine Testseite ist hier: Link

Wie bekomme ich das auf Win Browsern auch richtig zum Laufen?

 

[SpiceLab]

ich soll auf einer Seite eine kleine Laufschrift einbauen. Eigentlich kein großes Problem, nur flippen da die meisten Windows Browser bei aus.

Das trifft ausschließlich auf diese Seite zu, denn grundsätzlich unterstützen sie alle max-width einwandfrei.

Demo: http://jsfiddle.net/spicelab/r5f8cf3w/

Vielmehr liegt der Fehler bzw. die Ursache in der Positionierung der Laufschrift: in Chrome, IE u. Opera befindet sie sich nämlich nicht unterhalb, sondern rechts neben dem Navigationsmenü, und füllt (der Eigenschaft entsprechend) den zur Verfügung stehenden Raum aus. In Chrome u. Opera beträgt die "Restbreite" ~3px, im IE ist aber zudem das komplette Menü nach unten links verrutscht, womit die "Restbreite" ~370px beträgt.

Wie bekomme ich das auf Win Browsern auch richtig zum Laufen?

Offensichtlich muß noch der Umfluß float:left der Listenpunkte mittels clear:left beendet werden, damit die Laufschrift unterhalb des Menüs ausgerichtet wird:

.marquee {
    ...
    clear:left
}

[edit]Tipp-Ex[/edit]​

 

[Sprint]

Vielen Dank für die schnelle Hilfe. Darauf wäre ich so schnell wohl nicht gekommen.

 

[SpiceLab]

Gern geschehen Ich hab intuitiv auf meine Erfahrungswerte ob der Ursache vertraut