Layout = Bildschirmauflösung?

[Sascha79]

Hallo Leute,

was mich brennend interesiert ist;

wie passt sich meine Site der Bildschirmauflösung des Users an, so wie das
z. B. hier mit dem TP der Fall ist.

Was ist das Stichwort???

Danke

[koenixblau]

Liquides Layout - relative Größenangaben, ...

[Sascha79]

Ja da ich aber auch selber draufkommen können.

Vielen Dank auch!

[koenixblau]

Ja da ich aber auch selber draufkommen können.

Vielen Dank auch!

Gern geschehen, ...
manchmal ist es wirklich "leichter" als man denkt.

Hier zwei Beispiele:
"Dynamisch": http://www.intensivstation.ch/files/...es/temp05.html
"Fixiert": http://www.intensivstation.ch/files/...es/temp06.html

[Sascha79]

Habe mich leider noch nie mit CSS auseinander gesetzt. Das werd ich jetzt aber mal machen.

Ich hätte jetzt auf die Schnelle einfach diese Lösung genommen.

<div id="layer" style="position:absolute; left:0px; top:0px; width=100%; height="1000px", z-index="0"></div>

Könnte man das vorerst so lassen, bis ich mich etwas in CSS reingearbeitet habe???

[Boris]

CSS Angaben macht man nicht wie in HTML mit = und " ... " ... das hier ist falsch:

width=100%; height="1000px", z-index="0"

Wenn, dann müsste es so aussehen:

width: 100%; height: 1000px; z-index: 0;

[Sascha79]

Ich weiss das man CSS Angaben nicht wie in HTML vornimmt.

Meine Frage war ob man es auch vorerst mit der %-angabe im DIV lösen könnte oder ob das eine schlechte Idee ist?

z. B. So (hier der code nochmal richtig)

<div id="layer" style="position:absolute; left:0px; top:0px; width:100%; height:"1000px"; z-index="0"></div>

[Boris]

Du hast es schon wieder falsch geschrieben - so stand es oben doch auch schon?

So wird ein Schuh draus:

<div id="layer" style="position:absolute; left:0px; top:0px; width:100%; height: 1000px; z-index:0;"></div> 

[Sascha79]

Hallo Boris,

entschuldige bitte, bin seit neun Tagen frischgebackener Papa und völlig übermüdet. Daher wahrscheinlich im Moment diese ständigen Verschreiber.

Ich fasse deine Antwort jetzt einfach mal so auf, das man diese Prozentangabe im DIV ohne grössere, vorhersehbare Probleme verwenden kann, bis ich die Zeit finde mich mit CSS auseinander zu setzten.

Mein nächstes Ziel ist, mit CSS ein liquides-Layout zu erstellen. Hierzu habe ich ja schon von Koenixblau super Tips bekommen.

Für weitere Hilfe und Tips zu diesem Thema würde ich mich sehr freuen. Da es halt immer recht schwer ist einen Anfang zu finden.

...und noch ein dickes Dankeschön.

[Boris]

Gratulation ...

Ja, du kannst es so ohne Probleme erstmal nutzen. Aber als Ziel für die Zukunft schau dir keine absolute und relative Positionierung an, sondern arbeite dich in float und clear ein.

[koenixblau]

"Mein Beleid" zur chronischen Übermüdung.

Nach zwei Jahren kann ich sagen das nun alles automatisch passiert, ...
selbst meine Multitasking Fähigkeiten haben sich ausgeprägt.

Zum Thema, ...
wenn du dich hier in die CSS Abteilung reinliest unterstützt das auch angenehm den Lernfluss. Da auch einige andere ausser dir und mir, komischerweise, die gleichen Probleme haben/hatten.

Explizit auf Beiträge von Boris, hero-master, Rizzo und Co achten.

[Sascha79]

Explizit auf Beiträge von Boris, hero-master, Rizzo und Co achten.

Aber auch deine Beiträge sind alles andere als zu verachten.

Habe auch schon rausgefunden wer hier die guten Leute sind. Danke Leute, auch für die Unterstützung in PHP.

[koenixblau]

Ach, ich gebe das nur weiter was ich irgendwo mal gelesen hab.

[Sascha79]

Hallo koenixblau,

Hier zwei Beispiele:
"Dynamisch": http://www.intensivstation.ch/files/...es/temp05.html
"Fixiert": http://www.intensivstation.ch/files/...es/temp06.html

Zu diesen Links hätte ich noch ein paar Fragen.

Wie schaffst du es das hier alles "mittig" ausgerichtet ist? Ich habe ein Content (width 600px) erstellt und würde das gerne "mittig" vom Bildschirm ausrichten. Aber wie?

Des weiteren ist es vielleicht möglich dieses Thema nach CSS zu verschieben???

[koenixblau]

Du erstellst ein "Kontainer" der das alles umfasst,
beispielsweise so: http://www.intensivstation.ch/files/...es/temp10.html.