Index.html soll sich Bildschirmauflösung anpassen

[xBlacky33]

also habe eine art startpage (ist die index.html) und die soll sich der auflösung des betrachters anpassen .. da sonst pics ect immer zu gross oder nicht anrichtiger stelle sich befinden

hab mal die index mit fotos angehängt .. hoffe mir kann einer weiterhelfen .. bin wo doch langsam zu alt für das alles hier ^^


index.rar

danke euch schonmal

[zulujaner]

hallo xBlacky33,

wenn ich dich richtig verstehe willst du die beiden Schaltflächen ordentlich anordnen oder das riesige Hintergrundbild?

das mit dem Bild wird schwieriger. Da brauchst du meines Erachtens für jede Auflösung ein anderes. Dann mußt bei jedem Browser aufruf die Auflösung ausmessen und das entsprechende Bild auswählern.

^^ Kompliziert...

Ich denke so gehts auch...

Habe dein Bild für eine 1024er Auflösung verkleinert und als Hintergrundbild in einen extra DIV Container gelegt, der ist genausogroß wie dein Bild. Das besondere ist aber, das dieser DIV horizontal und vertikal in der Mitte des Browsers plaziert ist und nix mehr verrutschen kann. Und das funktioniert automatisch bei jeder Fensterauflösung.

in diesem DIV liegt ein weiterer namens footer, der sorgt für die Platzierung deiner Button am unteren Rand. Die Bilder sind mit float left und right angeordnet.

damit dein Hintergrundbild bei höheren Auflösungen nicht so klein und verloren im Bildschirm steht empfiehlt sich für den BODY hntergrund eine Farbe oder en gekachelter Hintergrund. Ich habe schwarz gewählt, erschien mir stimmig..

Aber entscheide selbst...
Im Quellcode siehst du die Arbeitsweise. Hab extra ganz wenig geschrieben...

teste mal.. viel spaß

[xBlacky33]

gefällt mir so .. wunderbare arbeit .. danke dir .. so wollte ichs haben

[zulujaner]

danke

kleiner tipp noch, mach die Grafiken der Button im Grafikprogramm nur so groß, wie die Schrift ist alles andere ist nur unnützer Ballast, 800px breit iss en bisserl viel.

Ausrichten kannst du dann wieder mit padding-left:30px;für das linke Bild und mit dem rechten entsprechend padding-right:30px; zum Beispiel.

So denn, viel Spaß...