[GELÖST] Probleme mit rechtem Bild bei höheren Bildschirmauflösungen

[ottyscom]

Hallo zusammen

auf meiner Website habe ich nach viel probieren und experimentieren es geschaft die Fahnen images (Rechts) korrekt auf selbiger Linie des Menüs zu platzieren. Allerdings wenn man meine Seite mit einer höheren Bildschirmauflösung als 1024 x 768 aufruft dann springen die Fahnen  nach rechts aus dem Rahmen und das ist sehr blöd.

Hat da jemand einen Tipp um das zu fixen?

die seite

www.megatopradio.com/_newpage

Danke!

Ottyscom

[NaN]

...wenn man meine Seite mit einer höheren Bildschirmauflösung als 1024 x 768 aufruft dann springen die Fahnen  nach rechts aus dem Rahmen...

... und wenn die Auflösung kleiner ist als 1024x768, dann verdecken die Fahnen das Menü.
Es ist nicht ratsam, eine Seite für eine bestimmte Auflösung zu optimieren.
Leider ist Deine Seite mehr als invalide. D.h. sie enthält im Quelltext Zeichen, die es jedem Validator unmöglich machen diese überhaupt auf Validität prüfen zu können.
Prüfe mal welche Sprach- und Kodierungseinstellungen Du in der Config.php und in den globalen Einstellungen für das Backend und für das Frontend angegeben hast. Die sollten gleich sein.
Wenn ich mir die eigenschaften Deiner Seite anschaue, dann steht dort nämlich spanisch. Obwohl die Seite deutsch ist.
Hier im Forum gibts nen Thread, der sich mit mehrsprachigen Seiten beschäftigt. Vielleicht findest Du ja dort noch ein paar Anregungen.
HTML-Tidy meldet zudem noch 15 Warnungen.
Vielleicht solltest Du erstmal das ändern und Dich dann um die Fahnen kümmern.
Außerdem werd ich aus Deinem Markup nicht schlau.
Die Fahnen stehen dort unter dem mit dem Suchformular.
Das ist nicht logisch. Denn, wenn ich mir die Seite mal ohne Stylesheets anschaue, dann sollten die Spracheinstellungen ganz oben stehen, und nicht erst irgendwo auf der Seite.

Also ich würde folgendes machen:
1. die Fahnen oben rechts positionieren und nicht auf einer Höhe mit dem Menü. Dann gibts auch keine Probleme bei geringeren Bildschirmauflösungen.

2. die Fahnen auch im Markup ganz nach oben packen. Also hierhin:

Code: Select all

...
<div id="pagecontainer>

<div id="lang"> ... </div>
...

3. im Stylesheet, in dem das formatiert wird, die Anweisungen wie folgt ändern:

Code: Select all

div#lang {
    position:relative;
    float:right;
    background: transparent url(images/bgnav.jpg) no-repeat; 
    background-attachment: fixed;
    background-position:  center top;
    padding: 5px;
    margin:0 0 -120px 0; /* fixes fucking ie bug */
}

Habs mal lokal mit FF2.0 und IE7 getestet (Windows XP).
Bei mir funzt es.

Und dann solltest Du Dir vielleicht noch Gedanken über solche Sachen machen:

Jetzt läuft gerade:

215_uta_bresan_-_schenk_mir_diesen_sommer

Wenn der Titel zu lang ist, läuft er aus dem heraus und reicht bis in den Inhaltsbereich.

Ansonsten, nette Seite. Ich denke die paar Validierungsfehler kriegst Du auch noch hin.

[ottyscom]

Erst einmal recht herzlichen dank für all die Infos. Werde mich an Verbesserungen machen.
Grüsse aus Spanien

Ottyscom

[ottyscom]

Hallo nochmal.

Also so ganz die Lösung ist das noch nicht. Ich will unbedingt die Flaggen in der Mnü Zeile haben. wenn die Auflösung kleiner ist ist mir egal wenn sie wegspringen aber wenn die Auflösung grösser ist sollten sie nicht nach rechts auswandern.
Sie müssen in der Menüzeile bleiben. Gibt es da keine lösung? Ich habe mal soeben versucht mit einbau einer Tabelle aber dann erschenit so eine sch... weise zeile dazw. obwohl kein border angegeben ist. was kann man da nur machen? Gibt es da keine Lösung?

Oben rechts über dem menü müssen andere Sachen hin.

[NaN]

Dann probier mal folgendes:

Stylesheet:

div#lang {
    float:right;
    background: transparent url(bgnav.jpg) no-repeat;
    background-attachment: fixed;
    background-position:  center top;
    padding: 2px;
    margin:-30px 0 0 0;
}

Und im Template packst Du die Flaggen zwischen Menü und Suche:


...



...



...

[ottyscom]

Hey Super! 100000000 Dank

Musste zwar noch etwas mit den margin zahlen spielen

aber jetzt mit div#lang {
    float:right;
    background: transparent url(images/bgnav.jpg) no-repeat;
    background-attachment: fixed;
    background-position:  center top;
    padding: 3px;
    margin:-30px -295px 0 0;
}

funzt es.

Genau so wollte ich es

Vielen dank!

Auch die Validierungsfehler dürften nun weg sein. Habe sie alle vernichtet!

Grüsse aus Spanien