Problem mit Darstellung, Seite mittig halten

[holgerp]

Hallo
Ich habe bis vor kurzen lediglich mit reinem HTML und Tabellen gearbeitet
CSS gab es in meiner kleinen Welt lediglich ab den begin meines noch bestehenden Studiums.
Nun musste / habe ich gestern jedoch festellen müssen das man SCHON LANGE nichts mehr mit Tabellen in HTML bzgl des Layouts macht (*schäm*).
Ich habe demnach um mich "zumindest mal in Richtung" Up to Date zu bringen einwenig rum probiert und mal ein "Testfile" gebastelt welches auf meiner noch aus HTML Tabellen bastehenden Seite basiert, nun jedoch OHNE Tabellen.

Hier der link:
http://www.holgerpohr.com/testfile/test/index.html

Warscheinlich ist da auch wieder einiges falsch dran aber ich lerne und denke das es zumindest vom Ansatz her in die richtige Richtung geht ;)

So mein Problem besteht nun darin das ich früher mit einer auf Tabellen basierenden Seite meine Desktopauflösung ändern konnte wie ich will, die Seite "rutschte" quasie immer schön mittig.
Das passiert jetzt jedoch nichtmehr da ich ja einen festen Wert angegeben habe wo die einzelnen Objekte zu stehen haben.
Also, wenn ich jetzt davon ausgehe das meine Seite sich am oberen linken Bildschirmrand aufbaut ist das ja kein Problem da hier ja der Ausgangspunkt liegt, möchte ich jetzt jedoch das meine Seite oder sagen wir viel mehr als Beispiel in meinem Link das Mädel sammt Menü und logos IMMER mittig des Bildschirm bleibt, auch wenn die Desktopauflösung vareirt, was muss ich dazu tun?
Ich mein klar ich habe einen festen Wert beginnent von linken oberen Bildschirmrand angegenen, ABER mal ganz erlich, das sieht doch total Banane aus wenn ich jetzt mit einem Monitor komme der eine höhere oder geringere Bildschirmauflösung hat als der den Ich verwendet habe als ich die Werte im Queltext festgelegt habe, dann ist das ganze halt nie mittig sindern immer leicht rechts oder links...
Gibt es da evtl irgendeine Art an Lösung die ich umsetzten könnte?
Oder bin ich oder bzw ist man da gezwungen sich dabei eine quasie Auflösung auszusuchen auf die man die Werte festlegt?
Weil VON DIESEM STANDPUKT AUS GESEHEN würde man ja in einem solchen Fall mit einer Tabelle besser bediehnt sein da diese ja immer mittig bleibt insovern es keine Lösung für das Problem gibt. Oder sehe ich das falsch?

Wie gesagt ich lerne und versuche mich gerade unabhängig von meinem Studium (in dem wir bis dato nichts weiter gelernt haben als das was ich kann, sprich HTML und das scheinbar noch in seiner Urform *lach*)weiter zu bilden.

Gruß

[Felix Riesterer]

Lieber Holger,

Du sprichst weiterhin über Deine Seite, auch wenn Du sie nun anders realisieren willst. Von daher frage ich mich, warum Du nicht in Deinem alten Thread geblieben bist.

Es kann der Übersichtlichkeit nützen, in einem neuen Thread zu posten, allerdings diskutieren wir dann an zwei Ecken über fast dasselbe...

Liebe Grüße,

Felix Riesterer.

[holgerp]

Ui das tut mir Leid, Ich ging jetzt davon aus das meine Frage sich nicht auf die Katergorie meines alten Threads bezieht, d.h die Frage soll ja keine Bewertung meiner Seite sein sondern ein Problem lösen.
Ich wollte natürlich kein Doppelpost hier veranstalten...
Ich versuche halt lediglich gerade komplett neu anzusetzten, das ich dazu als Beispiel meine ALTE Seite genommen habe war eher Zufall ;)
Also sorry, ein Doppelpost war natürlich nicht beabsichtigt.
Gruß

Lieber Holger,

Du sprichst weiterhin über Deine Seite, auch wenn Du sie nun anders realisieren willst. Von daher frage ich mich, warum Du nicht in Deinem alten Thread geblieben bist.

Es kann der Übersichtlichkeit nützen, in einem neuen Thread zu posten, allerdings diskutieren wir dann an zwei Ecken über fast dasselbe...

Liebe Grüße,

Felix Riesterer.

[Felix Riesterer]

Lieber holgerp,

bitte zitiere sinnvoll und vermeide TOFU!

Liebe Grüße,

Felix Riesterer.

[GermanysNextTopfmodel]

Hi, wenn es um das horizontale mittige ausrichten geht, dann gib dem kompltten Bereich einen Container, mit margin:0 auto. Dadurch wird er horizontal immer mittig dargestellt.

Um es vertikal zu zentrieren, müsstest Du mit position:absolute arbeiten.
Aber so wie deine bisherige Seite aussieht, reicht Dir ja die horizontale zentrierung.

Gruß
GermanysNextTopfmodel

[holgerp]

Vielen dank
Ich habe das jetzt mal probiert, jedoch leider ohne Erfolg. Ich denke jedoch das ich das margin:0 auto einfach nur falsch setze.
Ich gehe jetzt davon aus das es unter <style="..."> kommt da dort ja die Position festgelegt wird.
Vermutlich ist das jedoch falsch da es ja nicht klappt. Wo müsste ich das den sonst ansetzen?
Du sagst ich soll damit den kompletten Container zentrieren, ich habe mal etwas gegooglet und mir mal ein paar Queltexte angeschaut, kann es sein das ich den margin wert hierher setzen muss:
<style type="text/css">
<!--
margin
-->
</style>
Dann jedoch stellt sich mir die Frage woher weis der Wert auf was er zuzugreifen hat bzw was er zentrieren soll da ich ja dort nichts weiter angegeben habe.
Oder gehe ich das ganez jetzt ganz falsch an?
Gruß

wenn es um das horizontale mittige ausrichten geht, dann gib dem kompltten Bereich einen Container, mit margin:0 auto. Dadurch wird er horizontal immer mittig dargestellt.

Um es vertikal zu zentrieren, müsstest Du mit position:absolute arbeiten.

[GermanysNextTopfmodel]

Hi,
Du müsstest erstmal dem ganzen "sichtbaren" Bereich einen div-Container verpassen, welchem du eine ID zuweisst. Anhand dieser ID kannst du ihn dann per css "ansprechen".

Du solltest Dir vieleicht mal dieses Tutorial anschauen, ist für CSS-Einsteiger ganz gut zu verstehen, und behandelt auch das mittige zentrieren.

Gruß
GermanysNextTopfmodel

[Felix Riesterer]

Du solltest Dir vieleicht mal dieses Tutorial anschauen

Das eben ist genau der Ärger dieser an-zwei-Stellen-Posterei! Ich hatte Holger bereits einen sinnvollen Link zu einem Anfänger-Tutorial gepostet, auf den er aber noch nicht reagiert hat...

Liebe Grüße,

Felix Riesterer.

[holgerp]

Hallo Felix

Das eben ist genau der Ärger dieser an-zwei-Stellen-Posterei! Ich hatte Holger bereits einen sinnvollen Link zu einem Anfänger-Tutorial gepostet, auf den er aber noch nicht reagiert hat...

(hoffe jetzt ist es kein Tofu) Das kann doch der "GermanysNextTopfmodel" nicht wissen insovern er nicht in meinem vorherigen Thread gelesen hat.
Ich habe deinen Link einfach nicht gesehen, habe ihn erst jetzt nach deinem Post bemerkt und werde mir ihn auch noch genauer anschauen, genau wie das Tutorial von "GermanysNextTopfmodel".
Vielen Dank an beide für die Links.
Ich denke damit werde ich das scheinbar kleine Problem recht schnell gelösst bekommen.
Gruß

[Auge]

Hallo

Du sagst ich soll damit den kompletten Container zentrieren, ich habe mal etwas gegooglet und mir mal ein paar Queltexte angeschaut, kann es sein das ich den margin wert hierher setzen muss:
<style type="text/css">
<!--
margin
-->
</style>
Dann jedoch stellt sich mir die Frage woher weis der Wert auf was er zuzugreifen hat bzw was er zentrieren soll da ich ja dort nichts weiter angegeben habe.
Oder gehe ich das ganez jetzt ganz falsch an?

Ja, ganz offensichtlich. Dir fehlen noch die Grundlagen von CSS, z.B. bezüglich der http://de.selfhtml.org/css/formate/einbinden.htm@title=Einbindung. Du kannst also CSS-Anweisungen im style-Attribut des betreffenden Elements notieren (zum testen in Ordnung, ansonsten zu vermeiden), im Kopf des HTML-Dokuments zwischen <style type="text/css"> und </style> oder in einer separaten Datei, die per <link rel="stylesheet" type="text/css" href="dateiname.css"> in das HTML-Dokument eingebunden wird (es gibt für diesen Fall noch andere Methoden, die *erstmal* nicht so wichtig sind, um das System zu verstehen).

Während im ersten Fall klar ist, welches Element formatiert wird, musst du in den beiden anderen das/die betreffenden Element(e) angeben.

Dein:

<style type="text/css">  
<!--  
margin  
-->  
</style>

... wird also schon deshalb nicht funktionieren, weil du nicht angibst, für welches Element diese Anweisung gilt.

Mit:

<style type="text/css">  
<!--  
div { margin:0, auto; }  
-->  
</style>

... wird jedes <div> mittig zentriert und hat nach oben und unten keinen Außenabstand. Da du aber nur ein bestimmtes <div> zentrieren willst, musst du es auch explizit ansprechen. Dazu muss es im Dokument identifizierbar sein. Dies erreichst du mit einer ID, wenn es um ein *ganz bestimmtes* im Dokument einzigartiges Element geht, oder mit einer Klasse, wenn es um eine identifizierbare Gruppe von Elementen geht (siehe dazu: <http://de.selfhtml.org/html/attribute/allgemeine.htm@title=SELFHTML Universalattribute>).

<!-- Doctype und Head des Dokuments -->  
<body>  
 <div id="alles">  
  <!-- Hier drinnen wird der ganze Inhalt des Dokuments notiert -->  
 </div>  
</body>

#alles { margin:0, auto; }
... wäre eine passende Kombination. Das <div>, das allen Inhalt des Dokuments gruppiert, wird mit der ID "alles" versehen und wird mit dieser ID im CSS angesprochen.

Tschö, Auge