flexible kopfzeile zweiter Versuch

[hawa]

Hab nochmal versucht einen Seitenkopf zu schreiben, der sich dem Viewport anpasst.

Kopf

Den leeren div habe ich mit Absatzen gefüllt, hoffe so ist's OK.
Validator sagt alles gut.
Ich find's OK.
Was meint ihr?

Soll ich da eigentlich noch ne min-width vergeben, z.B. so das der Text nicht umbricht?

Danke Hawa

 

[vitus37]

Hmm, bei dem Header ist das eine komplizierte Sache mit der Prozentangabe. Bei mir sieht das Bild zB total verzogen aus...

 

[koslowski]

Moin,

warum wird #haupt per position:absolute in den Viewport genagelt??

Die Höhenangabe von 100% dafür ist wirkungslos, weil 100% von was?
Da die Vorfahren (body, html) keine Höhenangabe haben, kann 100% für #haupt nicht errechnet werden und fällt auf den default-Wert zurück (height:auto; ).

Deine ganze Positioniererei mit Prozentangaben ist keine gute Idee. Bei kleineren Viewport (netbooks) geht dein Layout direkt so aus dem Leim das sich alles ineinanderschiebt.
Schon im IE7 und kleineren Bildschirmen wird deine HP schnell unbenutzbar.

Insgesamt ist deine Website ungefähr so flexibel wie ein 100 Tonnen Felsbrocken, nämlich gar nicht. Der große Vorteil von Websites ist doch eigentlich die Flexibilität.

Ich habe nicht den Eindruck als würdest du verstehen was du da tust.
Versuch doch erstmal ein normales px-Layout zu verwirklichen und schau dir noch mal die Grundlagen an.

 

[vitus37]

Schon im IE7 und kleineren Bildschirmen wird deine HP schnell unbenutzbar.

Was hat denn der IE7 mit der Bildschirmgröße oder dem Viewport zu tun?

 

[koslowski]

Was hat denn der IE7 mit der Bildschirmgröße oder dem Viewport zu tun?

Mit Bildschirmgröße/Viewport meine ich im Prinzip das Gleiche:
den sichtbaren Bereich im Browserfenster.

Im IE7 läuft das Layout schon bei mittelgroßen Bildschirmen aus dem Ruder.
Zieht man den Viewport kleiner wird es schnell ganz übel.
Bei einer geringeren Bildschirmauflösung wird es noch schneller noch schlechter.

Im Grunde habe ich nur ein paar Sachen aufgezählt die beim Fragesteller schlecht gelöst sind. Da hätte man noch viel mehr schreiben können.
Das Wichtigste ist imho das der Fragesteller einige wichtige Basics offensichtlich nicht verstanden hat. Da sollte er erst mal ansetzen. :-)

 

[hawa]

Erstmal Danke
so find ich es gut sagt mir was falsch ist, ich sag euch warum ichs gemacht habe und dann lerne ich die Grundlagen deshalb bin ich hier. Hoffe es nervt nicht zusehr.
Hallo vitus
Das Bild ist ein Hintergrundbild (Hb), eigentlich soll sich nur der Rahmen über das Bild schieben
die % formatierungen hab ich deshalb nur der class kopf gegeben. Durch das center des Hb's wollte ich erreichen das das Gesicht des Hundes immer in der Mitte ist. Denke das Bild an sich ist durch den Ausschnit verzerrt den eigentlich müßte es als Hintergrundbild doch seine Struktur behalten?
Hallo koslowski
Wenn ich das absolute Haupt rausnehme verliert der Rahmen um die class kopf seine Höhe.
Durch das absolute Haupt greift doch erst die % height oder?
Die Seite kopf ist nicht ordentlich, sie sollte nur das Css darstellen habe sie nicht angepasst.
Bitte schaue einmal hier
home
so solls am Ende aussehen. Hier verschiebt sich alles so das die Strukturen erhalten bleiben. Ich hab dazu aber noch Millionen ach was sach ich tausende Fragen. Deshalb wollte ich nur mit einer anfangen.

Bitte schreibt mir ob ich wirklich so falsch gedacht habe.

Hawa

 

[koslowski]

ich bin grad mit dem netbook meiner Frau im Internet unterwegs und damit ist deine Site absolut nicht zu gebrauchen, weil im Inhaltsbereich alles ineinander und übereinandergeschoben ist.

Das Problem fängt schon da an, das du position:absol. nicht richtig verstehst.
Das hat mit den Prozenthöhen deines Kopfes nix zu tun.
Prozentabstände und Breiten/Höhen sind von Hause aus gefährlich, weil der IE besonders IE6/7 Probleme bei der Berechnung hat. Da muss man immer ein bißchen Spiel lassen.

Deine wirkungslose Höhenangabe sreht noch immer drin.
Um das Ganze zu verschlimmern hast du jetzt noch eine Tabelle als Designmittel mißbraucht.

Arbeite Little Boxes Online durch , um die Grundlagen zu verstehen, sonst wird das nie was.

 

[hawa]

Alles ok ich geb auf. Das hab ich wirklich nicht verstanden.
home
Ich habe jetzt auf 5 verschiedenen Rechnern mit fünf verschiedenen Auflösungen ( Viewports ), und auf dem Handy meiner Tochter geschaut. Habe alle im Fenster laufen lassen.

Bei mir läuft nichts ineinander sondern springt bevor es zusammenläuft von rechts nach unten so wie ich es gewollt habe. Vielleicht ist es nicht richtig so, aber es bleibt immer lesbar.

Die Tabellenlösung ist nicht optimal hab ja gesagt habe noch tausend Fragen.
:-|

Wie bitte bekomme ich das hin, das der Kopf immer 20% Höhe vom Viewport hat ohne absolute Positionierung,

Für einen Link wäre ich dankbar.
Bitte sagt mir ob es bei euch ineinader läuft und welchen Viewport ihr benutzt.

Danke Hawa

 

[Efchen]

Mit Bildschirmgröße/Viewport meine ich im Prinzip das Gleiche

Aber tatsächlich sind es zwei Dinge, die niemals exakt gleich sind und oft völlig verschieden.
Du solltest Dir angewöhnen, die richtigen Bezeichnungen zu verwenden, denn sonst sind Missverständnisse vorprogrammiert.
Nur deswegen gibt es so unsinnige Dinge wie "Auflösungsweichen".

 

[koslowski]

Aber tatsächlich sind es zwei Dinge, die niemals exakt gleich sind und oft völlig verschieden.

natürlich sind das zwei verschiedene Dinge.

Du solltest Dir angewöhnen, die richtigen Bezeichnungen zu verwenden, denn sonst sind Missverständnisse vorprogrammiert.
Nur deswegen gibt es so unsinnige Dinge wie "Auflösungsweichen".

Ich denke ich bin durchaus selber in der Lage mit dem Fragesteller zu klären, was ich wie gemeint habe. Ist ja auch schon vor deiner Einmischung geschehen.