Logo Profil | Mitglieder | Registrieren | Start | Suche


Command Board » Programmierung » HTML, JavaScript & CSS » Zoomen zerschießt Layout    » Hallo Gast [Login | Registrieren]

Neues Thema | Antworten   

Autor Beitrag
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
     Zoomen zerschießt Layout Zitat | Bearbeiten

Hallo an alle ,

lese schon eine ganze Weile hier im Forum und habe beschlossen mich nun hier anzumelden, da es ein Problem in meinem Layout gibt, dessen ich nicht instande bin es zu lösen.

Ich habe mir schon Nächte lang den Kopf darüber zerbrochen, aber jede mögliche Lösung zeigt leider die selben Fehler auf.

Ich code erst seit Dezember letzten Jahres und stehe noch ziemlich am Anfang, ist auch meine erste komplett selbt gecodete Homepage. Vorher hatte ich nur das Design über CSS gestaltet. Da ich das Design mit Table's immer zu umständlich fand, habe ich mich entschieden dies über CSS (Div's) zu machen.

Anbei findet ihr den Link zum Betrachten der Testseite. Beachtet das Impressum nicht, das ist nur eine Kopie und dient zum testen. Wobei das Copyright der Grafiken aber natürlich bei mir liegt, aber das ist wohl selbsterklärend. Hier der Link:

http://the-z-experience.style24.de/Home.html

Man bemerkt mein Problem beim ranscrollen und wegzoomen. Die Navigationsleiste springt aus dem Layout, genauso wie die anderen Teilen (Header, linke+rechte Boxen) welche als Kindelemente des Inhalts fungieren.

Ich hoffe jemand hat eine Idee wie er mir helfen kann, denn mir gehn langsam die Ideen aus.

Schöne Grüße,

Raziel


01.03.2010, 22:04 Profil | PM | Homepage | E-Mail  
Gast


      Zitat | Bearbeiten

ich hab gezoomt..
..und die seite sah genauso scheisse aus wie vorher..
für 3.6 optimiert? da hab ich ja glück, dass du nicht nur mit css 3.0 gearbeitet hast.

wo ist jetzt dein problem??


02.03.2010, 04:09  
Gast


      Zitat | Bearbeiten

EDIT: ich hab Firefox V3.5.8


02.03.2010, 05:22  
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
      Zitat | Bearbeiten

Vielen Dank für diese rationale Meinung...

die Homepage ist immer noch im Aufbau und zuerst müssen mal die Probleme mit dem Layout gelöst werden, bevor etwas styletechnisch mehr gemacht werden kann

an deiner stelle würde ich mich mal gewählter ausdrücken mit Beiträgen wie "sieht genauso scheiße aus wie vorher" bist du absolut keine Hilfe und unfreundlich noch dazu, wie sacht man so schön, registrier dich hier erst mal, versteck dich nicht hinter dem Gastaccount und machs besser. Deine Ironie kannste auch behalten.

Ich würde euch raten, das sperren von Gästebeiträgen zu deaktivieren. Dann kann sich jeder ganz seriös hier anmelden und dann etwas schreiben, denn so sinkt das Ansehen der ganzen Community, wenn ein Gast hier so ne super hilfe ist.

Wie auch immer. Macht den Firefox an oder jeden anderen Browser, hier tritt derselbe Fehler auf, zoomt mal weg oder ein paar Stufen ran, dann, dann merkt ihr wie der mittlere Div Container auseinandergezogen wird (die einzelnen Bereiche wie Header und co. hängen nicht mehr aneinander und sind nicht mehr in Form). Genauso oben bei der Navigation, welche, rechts auf einmal an Länge gewinnt. Ich muss also irgendwo etwas falsch gemacht haben, nur weiß ich leider nicht wo.

Hoffe diesesmal kann mir jemand seriöses helfen.


02.03.2010, 08:09 Profil | PM | Homepage | E-Mail  
Thoro
Mitglied
Sehr guter User


Dabei seit: 29.09.2008
Herkunft: keine Angabe
Posts: 830
      Zitat | Bearbeiten

Ich wollte dir gestern schon mal Rückmeldung geben, aber als ich nach dem Erstaufruf der Seite nur noch Server-Fehlermeldungen bekam, vermutete ich, dass du gerade am Basteln bist.

Wie dem auch sei, ich kann das Problem mit Firefox 3.6 nicht nachvollziehen. Rein-, Rauszoomen, alles klebt perfekt aneinander.


Leidenschaftlicher Rechtschreibfehler-Sammler sucht mehrere Lagerhallen zwecks Erweiterung der Sammlung. Bis zur Vergrößerung der Lagerkapazitäten bitte möglichst keine Rechtschreibfehler mehr posten. Danke.
02.03.2010, 08:20 Profil | PM | Homepage | E-Mail  
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
      Zitat | Bearbeiten

Hi Thoro,

vielen Dank für deine Antwort.

Ja tut mir leid, gestern Abend hatte sich im FF auch noch ein Problem mit den Webfonts aufgetan (ich weiß diese werden erst in CSS3 implementiert ^^). Hatte aber in einer Zeitschrift gelesen, dass man diese Feature schon benutzen kann. Funktionierte bisher auch super im FF, aber komischerweise jetzt nicht mehr, geht nur noch im IE.

Zu meinem anderen Problem ich habe mal ein paar Screens gemacht, du findest Sie im Anhang gepackt (Original ist PDF). Habe die Stellen beispielhaft markiert. Es verschiebt sich im Safari genauso wie im Firefox.

Dateianhang:
 Fehler.pdf.zip  (31 KB, 27 mal herruntergeladen)



Post wurde schon 4x editiert, das letzte mal am 02.03.2010 um 11:17 von RazielZ
02.03.2010, 11:14 Profil | PM | Homepage | E-Mail  
Thoro
Mitglied
Sehr guter User


Dabei seit: 29.09.2008
Herkunft: keine Angabe
Posts: 830
      Zitat | Bearbeiten

Ach du liebe Güte. Ich habe im Titel was von einem zerschossenem Layout gelesen und nicht damit gerechnet, dass es sich dabei um Element-Positionsabweichungen von einem Pixel handelt. Wenn man in Betracht zieht, dass diese Verschiebung nur in bestimmten Zoomstufen auftritt, so werden es ganz einfach Rundungsfehler sein.

Das wiederum kann man dem jeweiligen Browser eigentlich auch nicht verübeln, wenn er über solche Maße in deinem CSS stolpert:
-> 100.01% (denn 100% ist noch nicht groß genug)
-> 184.35px (bitte nicht das ganze Pixel beleuchten)

Bei aller Liebe zur Genauigkeit, man kanns auch übertreiben. Versuche es mal mit Angaben in vollen Pixeln, dann könnte auch das Rundungsproblem verschwinden.


Leidenschaftlicher Rechtschreibfehler-Sammler sucht mehrere Lagerhallen zwecks Erweiterung der Sammlung. Bis zur Vergrößerung der Lagerkapazitäten bitte möglichst keine Rechtschreibfehler mehr posten. Danke.
02.03.2010, 17:44 Profil | PM | Homepage | E-Mail  
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
      Zitat | Bearbeiten

ja sorry, hatte mich etwas falsch ausgedrückt

die fehler sind zwar nur minimal und auch nicht in jeder zoom stufe, aber dennoch störend, zumal das layout später immer einwandfrei sein soll und das krieg ich im moment nicht hin

es ist die navigation, welche sich nicht konform verhält. Habe ich zum Beispiel Oben Leiste und Nav so angepasst, dass beide von der Länge genau gleich sind (padding etc berücksichtigt), is die Nav beim weg-/ranzommen wieder nicht im layout, was ich mir nicht erklären kann.


02.03.2010, 19:42 Profil | PM | Homepage | E-Mail  
Gast


      Zitat | Bearbeiten

Du hast es auf jeden Fall versäumt 'nen ordentlichen Wrapper um die Site zu bauen und dir den weiteren Aufbau ordentlich erschwert. Ich würd das komplette Css inne Tonne kloppen und nochmal neu anfangen. Du hast 'absolute'- und Prozent-Angaben drin die du
1. nicht brauchst
2. jeder Browser ignoriert...
..weil sich deine Css Angaben in vielerlei Hinsicht widersprechen.
Das komplette Layout ist eigentlich der totale Schrott und entspricht nicht ansatzweise dem 'heutigen' Stand.
Ich sag das so ausdrücklich, weil du so 'nen unglaublichen Wert auf EINEN Pixel Verschiebung legst, bei jeder ungeraden Zoom Stufe.
In meinem letzten Post hab ich das zurecht mit 'Scheisse' betitelt.
Gruss



03.03.2010, 02:41  
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
      Zitat | Bearbeiten

Ja das mit dem Wrapper stimmt wohl, hab jetzt aber die Layout-Technik mit Tables endlich mal komplett verstanden, sodass ich die nächsten Tage was machen kann. Mit Divs hatte es nicht so geklappt wie ich wollte, hoffe mal, dass es dann besser klappt wenn ich fertig bin.

Danke für die Hilfe!


04.03.2010, 19:05 Profil | PM | Homepage | E-Mail  
looper
Mitglied
Aktiver User


Dabei seit: 27.01.2008
Herkunft: keine Angabe
Posts: 246
      Zitat | Bearbeiten

Achtung!!!!
Warum Layout mit Tabellen dumm ist


Hier ist Siggi die Signatur

JETZT IST ALLES AUS!
05.03.2010, 14:34 Profil | PM | E-Mail  
SuXxesS
Mitglied
Aktiver User


Dabei seit: 12.05.2008
Herkunft: keine Angabe
Posts: 229
      Zitat | Bearbeiten

Zitat:
Orginal von RazielZ
Ja das mit dem Wrapper stimmt wohl, hab jetzt aber die Layout-Technik mit Tables endlich mal komplett verstanden, sodass ich die nächsten Tage was machen kann. Mit Divs hatte es nicht so geklappt wie ich wollte, hoffe mal, dass es dann besser klappt wenn ich fertig bin.

Danke für die Hilfe!


Böse Idee, das mit den Tabellen. Kennst du Bausünden aus den 80ern? Ungefähr das sind Tabellen im Web. Gut, Tabellenlayouts stammen nicht aus den 80ern, aber sind mindestens genauso schrecklich wie die besagten grauen Schandlfecke.

Ich kann dir www.peterkropff.de empfehlen, gehe mal die HTML/CSS Basics durch.
Danach darfst du beim basteln dann auch das schöne Gefühl haben, alles richtig zu machen (tust du zwar nicht, bist aber auf dem besten Wege dahin).


08.03.2010, 21:28 Profil | PM | E-Mail  
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
      Zitat | Bearbeiten

werd ich machen danke

könnt ja nochmal auf die Seite gehn, ich hab das layout jetzt mit DIV's gemacht, nur der Mittelteil, ist in einer Tabelle, die aber nicht sehr groß ist, damits geordnet ist. Hab zwar auch ne reine DIV version, hier ist der Header der rechten Box, aber leicht verrutscht und der Große Header links verschiebt sich leicht beim rauszoomen, was aber nicht mehr so tragisch ist, das würde ich noch hinkriegen. Allerdings verrutscht der Content immer, der auch mit nem Div & Style beginnt (siehe mix) ganz an den rechten Bildschirmrand, wenn nicht zumindest ein Br oder so eingetragen ist, was ich auch wieder nicht verstehe. Aufjedenfall funktionierts jetzt super, dank Wrapper ^^ und der Unterschied zu beiden Versionen ist nur unwesentlich.

Mix
http://the-z-experience.style24.de/Home.html

Only Div
http://the-z-experience.style24.de/Div.html

edit: habs mal im Safari gecheckt, hier funktionierts wieder nicht X)




Post wurde schon 5x editiert, das letzte mal am 09.03.2010 um 07:14 von RazielZ
08.03.2010, 21:39 Profil | PM | Homepage | E-Mail  
alex1702
Mitglied
Exzellenter User


Dabei seit: 25.05.2008
Herkunft: NRW
Posts: 1457
      Zitat | Bearbeiten

noch mal kurz gesagt:
5 Leute von 100.000 wissen das man zoomen kann, 2 davon machen das auch. Also wenn da Fehler im Layout entstehen beim zoomen, ist das echt nicht tragisch, ich bin ja manchmal schon pingelich, aber sowas ist ein bsichen übertrieben. Und am besten benutze dann das nächste mal einfahc ein ganzes Bild als Hintergrund. Echt ej.
So udn ich hoffe du kommst nicht nochmal auf die gloreiche Idee Tabellen zu benutzen. Ich hab ganz am anfang tabellen benutzt, wiel ich kein css konnte und mein editor das halt schön mit tabellen machen konnte, diese Seite gitb es nun nicht mehr, ich amch jetzt jede verdammte scheiss Tabelle mit Divs und CSS udn das Design erst recht so. Bei mir ist es auch selten das ich HTML Tags benutze, meistens sidn es nur Divs. ALso kannst shcon froh seinw enn du bei mir bei der Überschrift ein h1 findest. xD
Aber das jetzt nur zu mir, du musst das nicht so machen. Viel Spaß noch mit dem Programmieren, Designen.


Mfg
alex
10.03.2010, 18:59 Profil | PM | Homepage | E-Mail  
asdf
Mitglied
Guter User


Dabei seit: 26.10.2009
Herkunft: keine Angabe
Posts: 302
      Zitat | Bearbeiten

das stimmt alex1702. wenn jemand eine seite zoomt ist er selber schuld wenn das layout fehlerhaft ist


10.03.2010, 20:44 Profil | PM | E-Mail  
RazielZ
Mitglied
Neuling


Dabei seit: 01.03.2010
Herkunft: keine Angabe
Posts: 7
      Zitat | Bearbeiten

ok, alles klar, danke für die hilfe


11.03.2010, 15:26 Profil | PM | Homepage | E-Mail  
Thoro
Mitglied
Sehr guter User


Dabei seit: 29.09.2008
Herkunft: keine Angabe
Posts: 830
      Zitat | Bearbeiten

Zitat:
alex1702: 5 Leute von 100.000 wissen das man zoomen kann, 2 davon machen das auch.

Auch wenn ich zugeben muss, dass die Zoomfunktion einige nicht kennen werden, ist die Schätzung doch eher maßlos übertrieben. Es soll ja auch Leute über 40 geben, die das Internet benutzen, wenn du verstehst, was ich meine.

Zitat:
alex1702: Ich hab ganz am anfang tabellen benutzt, [...] , ich amch jetzt jede verdammte scheiss Tabelle mit Divs und CSS udn das Design erst recht so. Bei mir ist es auch selten das ich HTML Tags benutze, meistens sidn es nur Divs. ALso kannst shcon froh seinw enn du bei mir bei der Überschrift ein h1 findest. xD

Das ist irgendwie deprimierend. Nach der Ära der sinnlosen Tabellen kommt nun die Ära der sinnlosen div-Container auf uns zu, oder wie ist das zu verstehen? Die Idee von CSS war Semantik und Design zu trennen, nicht die Semantik in der Mülltonne zu entsorgen.

Zitat:
asdf: wenn jemand eine seite zoomt ist er selber schuld wenn das layout fehlerhaft ist

Hm, und wenn er nicht den Browser benutzt, den du verwendest, dann ist er selbst Schuld, wenn das Layout fehlerhaft ist. Und wenn er eine andere Bildschirmauflösung benutzt als du, ist er selbst schuld, wenn das Layout fehlerhaft ist. Und wenn er die Spezialschriftart nicht installiert hast, die du verwendest, dann ist er selbst schuld, wenn das Layout fehlerhaft ist ...


Leidenschaftlicher Rechtschreibfehler-Sammler sucht mehrere Lagerhallen zwecks Erweiterung der Sammlung. Bis zur Vergrößerung der Lagerkapazitäten bitte möglichst keine Rechtschreibfehler mehr posten. Danke.
11.03.2010, 15:45 Profil | PM | Homepage | E-Mail  
asdf
Mitglied
Guter User


Dabei seit: 26.10.2009
Herkunft: keine Angabe
Posts: 302
      Zitat | Bearbeiten

Zitat:
Hm, und wenn er nicht den Browser benutzt, den du verwendest, dann ist er selbst Schuld, wenn das Layout fehlerhaft ist. Und wenn er eine andere Bildschirmauflösung benutzt als du, ist er selbst schuld, wenn das Layout fehlerhaft ist. Und wenn er die Spezialschriftart nicht installiert hast, die du verwendest, dann ist er selbst schuld, wenn das Layout fehlerhaft ist ...


also ich schaue immer das das layout auf möglichst alle browsers gut aussihet! Meine seiten sind meistens nicht so breit und somit wird die auflösung nicht ein problem sein (ausser er benutzt ein mobile phone, denn ich habe noch nicht die seiten für handys engepasst). ich verwende eigentlich keine spezial schriften also ist auch das kein problem. und so weiter.....


11.03.2010, 21:00 Profil | PM | E-Mail  
Thoro
Mitglied
Sehr guter User


Dabei seit: 29.09.2008
Herkunft: keine Angabe
Posts: 830
      Zitat | Bearbeiten

Und warum willst du einem Besucher dann nicht zugestehen in die Seite hinein zu zoomen?


Leidenschaftlicher Rechtschreibfehler-Sammler sucht mehrere Lagerhallen zwecks Erweiterung der Sammlung. Bis zur Vergrößerung der Lagerkapazitäten bitte möglichst keine Rechtschreibfehler mehr posten. Danke.
11.03.2010, 23:11 Profil | PM | Homepage | E-Mail  
electro_dave
Mitglied
Guter User


Dabei seit: 27.08.2009
Herkunft: Schweiz
Posts: 412
      Zitat | Bearbeiten

Oh mein gott lern css xD


jeder macht was er will, doch jeder steht dazu was er macht...
12.03.2010, 15:31 Profil | PM | E-Mail  
asdf
Mitglied
Guter User


Dabei seit: 26.10.2009
Herkunft: keine Angabe
Posts: 302
      Zitat | Bearbeiten

Zitat:
Original von Thoro:
Und warum willst du einem Besucher dann nicht zugestehen in die Seite hinein zu zoomen?


naja ich probiere die seite schon so zu gestallten das zoomen nichts ausmacht aber wenn ich nicht durblicke und nicht weiss wie ich es verbessern sollte das machts meinermeinung nach doch nicht so viel aus! oder?


12.03.2010, 17:53 Profil | PM | E-Mail  
Seiten (1):  1 
Command Board » Programmierung » HTML, JavaScript & CSS » Zoomen zerschießt Layout   

Neues Thema | Antworten   


Powered by Command Board 1.0 - Beta 2.0 © 2004-08 PHP-Einfach