• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Webseite auflösungsunabhängig programmieren

N

NoXiD

Neues Mitglied
Guten Tag!

Ich suche einen Ausweg aus der ewigen Frage wie ich meine Webseite auflösungsunabhängig gestalten kann, in Google finde ich nachwievor kein akzeptables Ergebnis.
Mein Problem ist folgendes: Ich programmiere eine Seite in html bzw css mit fullhd auflösung (mein Notebook). Jedoch soll diese bei meinem Auftraggeber eingesetzt werden, dessen Monitore haben aber verschiedene Auflösungen und da verschiebt sich das Layout immer extrem. Wie kann ich meine Webseite so schreiben, dass sie auf allen Auflösungstypen gleich angezeigt wird oder "mitskaliert" wird?

Freundliche Grüße
NoXiD
 
Relative Größenangaben? width:30%; usw..?

Werden Word-Dokumente eigentlich auch programmiert oder ist das so ne HTML Sache?
 
Hallo!
Danke erstmals für deine schnelle Antwort.
Mit relativen Größenangaben kann ich die Größe dynamisch einstellen, aber die Position wird dann ja trozdem immer noch verschoben oder?

Nein ist ne reine HTML bzw. CSS und jsf sache... ;)
 
NoXiD schrieb:
Mit relativen Größenangaben kann ich die Größe dynamisch einstellen, aber die Position wird dann ja trozdem immer noch verschoben oder?
Zum Vergrößern anklicken....

Nicht, wenn du die Art der Positionierung auf „absolute“ stellst.

HTML: 
<!DOCTYPE html>

<html lang="en">

    <head>
        <meta charset="utf-8" />
        <title>Demo</title>
        <style type="text/css">

            #test {
                position: absolute;
                top: 30%; right: 20%; bottom: 10%; left: 50%;
                background: red;
            }

        </style>

    </head>

    <body>

        <div id="test">#test</div>

    </body>

</html>

Ich möchte aber wie immer bei diesem Thema die Gegenfrage stellen: Wie soll das insgesamt funktionieren? Viewport-Größen sind vom Nutzer variabel festlegbar. Das heißt, auf dem einen Bildschirm kann etwa ein Browserfenster 1400x800 Pixel groß sein, auf einem anderen 500x1000 Pixel.

Das sind völlig unterschiedliche Seiten- und Platz-Verhältnisse.

Du stehst doch permanent vor diesem Problem:

- http://h3.abload.de/img/scaling-issuesldqt.png

Ich würde auf einen „responsive design“-Ansatz setzen:

- Adactio: Journal&mdash;Responsive enhancement
 
Hallo!

Danke vielmals für die Antworten! Ich werds jetzt mal mit absolute probieren und mir nebenbei responsive design etwas genauer ansehen. Soviel ich gelesen habe sollte das Umstellen nachher nicht unbedingt das große Problem sein...

Freundliche Grüße
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben