Lücke im Chrome nicht aber bei Firefox bei div tags? Warum?

[lachender_engel]

Ich weiss nicht, woher der engel die angaben hat, denn in meiner css file sind die slider alle auf 100% derBilder drinnen! Meiner bescheidenen Logik nach sollte sich der Slider den Bildern anpassen dadurch??
Und wenn ich statt % Angaben die px der Bilder in em angebe, dann verrutscht mir alles komplett bzw. jetzt hab ich auch
auf dem lokalen Rechner diese verdammte Lücke!!!!!!!!!
Ich bin wohl zu blöd für's webdesign, wie es aussieht!

Die Höhenangaben kommen durch das JS des Sliders. Denn die Style-Angaben sind inline - das heißt, sie hängen direkt im div tag und kommen nicht aus dem CSS.

Um den Fehler bei mir zu sehen bedurfte es der Veränderung der Auflösung des Browsers auf 1024x768 und dann die Seite aufrufen.

Woher ich die Daten habe? Aus den Developer-Tools der jeweiligen Browser Du kannst aber auch mit der rechten Maustaste auf Seitenquelltext anzeigen gehen und die Stelle suche. Mit dem Dev-Tools ist es nur bequemer.

Mein Tipp, wenn Du das nicht gelöst bekommst: Verwende nur BIlder die die selbe Höhe haben. Dann klapp es ;-)

 

[Myhar]

Der Slider funktioniert doch, oder slidet er nicht? Und was das "kollidieren" angeht: Das sind Grundlagen von CSS, gewisse Stile wirken sich eben auf andere Elemente mit gleichem Namen etc. aus. Auch hat jeder Slider eigene Berechnungen etc. und da kann es schon sein, dass man bei der eigenen Seite dann nachkorrigieren muss. Sonst würde es ja nur 1 Slider und nicht 10000e verschiedene geben.
Es spricht auch nichts dagegen, Dreamweaver zu verwenden, so lange es rein in der Code-Ansicht ist.

Was em, %, etc. angeht: Schau dir das nochmal an. Em bezieht sich nicht nur auf die Schrift, es bezieht sich auf die Größe der jeweiligen Schrift. Es kann aber bei jeder Größenangabe verwendet werden. Bezüglich %: Das ist jedesmal etwas anderes, wie im Supermarkt (Verzeih mir hier wieder mein sehr "für dummies" Beispiel, aber so tue ich mir am leichtesten es zu erklären). Das wäre, wie wenn jemand sagt, warum ist einmal 50% Preisnachlass 10€ und bei dem anderen Produkt sind es plötzlich 45€. Genauso ist es mit den % und em, das kann man nicht einfach in px umrechnen, da muss man berücksichtigen, worauf es sich bezieht. Und das ist für jemanden, der gerade erst mit HTML/CSS anfängt, nicht immer einfach festzustellen.

btw bezüglich Künstler/Fotograf: Ich habe deine Seite kurz geöffnet, brauchte nur ein gutes Beispiel. Ich denke, du hast schon verstanden, was ich sagen wollte.

 

[Edin Mustafic]

@Lachender Engel:
Das mit den Web Developer Tool ist ja wirklich eine Wucht! Da kann man ja sogar die css Formatierungen testweise umschreiben und sich das direkt ansehen. Cool! Auch hab ich das mit dem Validieren begriffen. Der schreibt zwar das irgendwas mit der 'id' nicht stimmt - also hab ich auf 'class' umgestellt, obwohl da ja nicht wirklich irgendetwas passier ausser das ich weniger Fehler angezeigt bekomme.

Ich hab jetzt zumindest mal alle Angaben gemäß euren Tipps umgestellt. Die relativen em Angaben nur für Text, und sonst alles andere in % Angaben umgewandelt. Ist ja voll die Rechnerei. Das Layout scheint sich nicht verändert zu haben! Das ist mal gut so. Scheinbar hab ich es halbwegs gut gemacht mit den Prozenten.



@Myhar:
Nur keinen Stress - ich bin ein 'dummy', was WebDesign angeht bzw. wie du schreibst ja WebDevelopment ... hahaha ... Da brauchst dich ned jedes mal dafür entschuldigen, dass ich keine Ahnung habe. Das ist ja so auch richtig, dass ich da Null plan habe!

Bezüglich des sliders, muss ich wohl dann einfach auf einen zweiten ausweichen, dann sollte das hinhauen! Das hab ich jetzt kapiert, dass die trotzdem auf das gleiche js. script zugreifen. Alle Bilder in gleichem Format hab ich früher immer gehabt, jetzt wollte ich wohl mal frech sein und versuchen, beide Formate irgendwie darzustellen.

Jetzt könnt's mir nicht mehr die webDevTools um die Ohren hauen!

 

[Edin Mustafic]

Ich hab bei allen meinen 'main' containern, wo der content drinnen ist, em Werte als Bezugspunkt für die % Berechnungen angegeben. Kann ich das so lassen oder soll ich diese Angaben in px machen oder kann ich da auch % Angeben, wobei ich will sowieso nicht, dass die Bilder grösser als 960px angezeigt werden. Ich hab ja die Bilder mit 1000x1000px raufgeladen - sonst müsste ich Sie ja grösser reinstellen, aber dann lädt alles langsamer. Ausserdem hab ich hier keinen Bezugspunkt für meine %-Angaben ausser die diversen Ausgabegeräte dann. Auf meinem 4K TV würden beispielsweise 80% auch mehr ausmachen in der Darstellung als 1000x1000px und dann wirds unscharf!
lg

 

[Myhar]

Es gibt immer einen Bezugspunkt für %-Angaben, und wenn es die 100% verfügbarer Platz sind ;-)
Du kannst auch die maximale Größe für Elemente mit max-width festlegen, da spricht auch nichts dagegen, Werte zu mischen:

#content{width: 70%; max-width: 900px }

bzw. empfiehlt es sich bei Bildern folgendes anzugeben: width: auto;max-width: 100% . Dann werden sie kleiner skaliert wenn weniger Platz ist und falls zu viel Platz ist, zu 100% angezeigt (aber eben nicht hochskaliert)
Wenn du von 4k TV sprichst: Hier siehst du, wie du auch das in den Griff bekommen kannst.

btw bezüglich validierung: Was wird als Fehler angezeigt? und du solltest dir auch über den Unterschied zwischen Klasse und ID klar werden, man kann durchaus nur mit Klassen arbeiten. Falls IDs verwendet werden (ist manchmal hilfreich zum wiederfinden von Stellen im Code, etc.) dann muss einem bewusst sein, dass IDs eine viel höhere Gewichtung im CSS haben als Klassen.