Div AutoScroll mit Width 100%

Computer: Software & Programmierung HTML & CSS
#1

Hallo Leute

Ich versuche folgendes aber es gelingt mir nicht:

Blabla

Der Inhalt von „Blabla“ ergibt ca. eine Breite von 1000px

Nun macht mir der Internetexplorer den DIV-Tag auch auf 1000px breit, statt sich mit 100% am nächsten Parent-Tag (in meinem Fall ein ) zu orientieren. Läuft die ganze Seite damit natürlich voll aus dem Bildschirm …

Komischerweise klappts mit dem Firefox und mit Opera perfekt: Der DIV wird ausgerichtet soweit Platz vorhanden, dann erscheinen die Scrollbalken.

Hat da irgendjemand eine Idee, an was das liegen könnte?
Allerbesten Dank
und Gruss
Patrick

#2

Was sollen Firefox und Opera auch anderes machen? Das ist eine normale Reaktion. Immerhin hast Du es mit overflow: auto ihnen selbst überlassen wie sie in einem solchen Fall regieren sollen. overflow: hidden bewirkt auch bei diesen beiden, dass der Überschuss versteckt wird.

Nebenbei bemerkt finde ich es ziemlich daneben, wenn der Inhalt aufgrund zu hoch gewählter Breite aus dem Bildschirm läuft. Schließlich hat nicht jeder eine Auflösung von über 800 x 600 Pixel. Aber sei’s drum, das muss jeder selbst wissen.

Gruß Marcus

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#3

Hallo Sven

Ich glaube, du hast das Problem nicht ganz richtig verstanden:

Was sollen Firefox und Opera auch anderes machen?

Die Frage lautet, wieso macht IE etwas anderes?

Schließlich hat nicht jeder eine Auflösung von über 800 x 600 Pixel. Aber sei’s drum, das muss jeder selbst wissen.

Deshalb will ich ja den DIV-Tag mit Scrollbalken!

Nebenbei bemerkt finde ich es ziemlich daneben, wenn der
Inhalt aufgrund zu hoch gewählter Breite aus dem Bildschirm
läuft.

Es ist ja nicht so, dass die ganze Page in diesem DIV vergraben liegt: innerhalb des DIV werden Thumbnails von Bildern dargestellt, welche durch Benutzeraktion an einer anderen Stelle der Page vergrössert dargestellt werden können.

Das Problem liegt daran, dass der IE nicht so regiert wie man es erwarten würde; er lädt den DIV nicht 100% gem. Parent trotz Overflow-Style, sondern macht sich immer so breit, dass alles was er drin hat Platz hat.

Anmerkung: wenn ich den DIV mit einer Pixelbreite beschränke (z.B. 100px) funktioniert’s; nur passt diese statische Angabe nicht, weil meine Page dynamisch auf Grössenänderungen reagiert.

Hoffe, dieser Versuch das Problem zu vermitteln war deutlicher.

Gruss
Patrick

Hallo Leute

Ich versuche folgendes aber es gelingt mir nicht:

Blabla

Der Inhalt von „Blabla“ ergibt ca. eine Breite von 1000px

Nun macht mir der Internetexplorer den DIV-Tag auch auf 1000px
breit, statt sich mit 100% am nächsten Parent-Tag (in meinem
Fall ein ) zu orientieren. Läuft die ganze Seite
damit natürlich voll aus dem Bildschirm …

Komischerweise klappts mit dem Firefox und mit Opera perfekt:
Der DIV wird ausgerichtet soweit Platz vorhanden, dann
erscheinen die Scrollbalken.

Hat da irgendjemand eine Idee, an was das liegen könnte?
Allerbesten Dank
und Gruss
Patrick

Das ist eine

normale Reaktion. Immerhin hast Du es mit overflow:
auto ihnen selbst überlassen wie sie in einem solchen Fall
regieren sollen. overflow: hidden bewirkt auch bei
diesen beiden, dass der Überschuss versteckt wird.

Nebenbei bemerkt finde ich es ziemlich daneben, wenn der
Inhalt aufgrund zu hoch gewählter Breite aus dem Bildschirm
läuft.

Gruß Marcus

#4

Hallo Patrick,

(in meinem Fall ein )

ich denke, daran liegt’s. Tabellenzellen werden durch übergroße Inhalte überdehnt. Auch z.B. Firefox macht das grundsätzlich so. Jetzt ist es für den Browser eine Interpretationsfrage, ob in Deiner Konstellation ein „overflow:auto“ anspringen müßte oder nicht. Der IE ist offenbar der Meinung, das sei nicht notwendig, weil er das Elternelement als flexibel einstuft und dem Kindelement genügend Platz verschafft. Wäre jetzt jedenfalls meine wohlwollende Auslegung. Weniger wohlwollend könnte man auch vermuten, der IE sei halt einfach buggy… aber das wäre ja langweilig. :wink:

Wie auch immer - es liegt an der Tabelle. Ohne Tabelle funktioniert das Konstrukt hervorragend. Sogar im IE.

Schöne Grüße
Yasmin

#5

Hallo Sven

Ich glaube, du hast das Problem nicht ganz richtig verstanden:

Gibt’s einen Link zu der Problemseite? Dann könnte man sich das ansehen.

Die Frage lautet, wieso macht IE etwas anderes?

Das fragst Du am besten die Leute von Microsoft. Die halten es nämlich nicht für nötig, sich an die Spezifikationen des W3C zu halten, die sie selbst mit verabschiedet haben. Folglich interpretiert der IE viele CSS-Anweisungen so wie er meint, und nicht wie es richtig ist.

Deshalb will ich ja den DIV-Tag mit Scrollbalken!

So wie ich das verstanden habe, möchtest Du einen horizontalen Scrollbalken (Du möchtest Div in der Breite ändern), und sowas ist schlecht. Vertikales Scrollen ist normal und üblich, aber horizontal ist einfach nur nervig.
Hast Du schon mal versucht, mit prozentualen Breitenangaben zu arbeiten, die sich dem Browserfenster anpassen?

Es ist ja nicht so, dass die ganze Page in diesem DIV
vergraben liegt: innerhalb des DIV werden Thumbnails von
Bildern dargestellt, welche durch Benutzeraktion an einer
anderen Stelle der Page vergrössert dargestellt werden können.

Das Problem liegt daran, dass der IE nicht so regiert wie man
es erwarten würde; er lädt den DIV nicht 100% gem. Parent
trotz Overflow-Style, sondern macht sich immer so breit, dass
alles was er drin hat Platz hat.
Anmerkung: wenn ich den DIV mit einer Pixelbreite beschränke
(z.B. 100px) funktioniert’s; nur passt diese statische Angabe
nicht, weil meine Page dynamisch auf Grössenänderungen
reagiert.

Also doch Prozentangaben?

Hoffe, dieser Versuch das Problem zu vermitteln war
deutlicher.

Lass mal ein Beispiel sehen. Dann kann man es wohl eindeutiger nachvollziehen. So ist es nur Spekulation.

#6

Hallo Yasmin

Besten Dank für die Antwort. Bin jedoch nicht ganz deiner Meinung; versuche mal folgendes:

eine breite Tabelle, und ich bin ganz rechts …

Wenn du nun diese Seite im IE öffnest und das Fenster sagen wir mal auf 300 Pixel breit ziehst, fährt die Tabelle aus dem Fenster und die ganze Seite erhält vertikale Bildaufleisten, obwohl der DIV das Overflow-Attribut explizit auf scroll gestellt ist. Mit overflow:auto ist es nicht anders.

Aber ich gehe mit dir einig, dass es sich wohl um einen Bug handeln muss; nur vielleicht weiss ja jemand einen Trick (spezial IE Attribut o. ä.).

Kannst das Problem reproduzieren? Ich habe es mit IE 6 SP2 ausprobiert.

Danke und Gruss
Patrick

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

#7

Hallo Patrick,

Wenn du nun diese Seite im IE öffnest und das Fenster sagen
wir mal auf 300 Pixel breit ziehst, fährt die Tabelle aus dem
Fenster und die ganze Seite erhält vertikale Bildaufleisten,
obwohl der DIV das Overflow-Attribut explizit auf scroll
gestellt ist. Mit overflow:auto ist es nicht anders.

Das liegt an dem Syntaxfehler, den Du eingebaut hast. Entweder fehlt innerhalb Deines Divs ein Anführungszeichen, dann würde es heißen

 Das kann nicht funktionieren, weil es für divs kein HTML-Attribut "width" gibt.

Oder es soll heißen

     was auch astrein funktioniert.
    
    
    
    > nur vielleicht weiss ja jemand einen Trick  
    > (spezial IE Attribut o. ä.).
    
    
    Auf Tabellen für's Layout verzichten?
    
    Schöne Grüße
    Yasmin
#8

Hallo Yasmin

Sorry, war mein kleiner Bug - jedoch: mit style=„width: 100%; overflow:scroll“ erhalte ich die gleichen Resultate:

FireFox 1.0 - ok (Scrollbalken erscheinen, juhui)
Opera 6.1 - ok (Scrollbalken erscheinen, juhui)
IE 6.0 - nich ok (DIV ist tatsächlich so breit, wie der Inhalt, bäh)

Ich stell jetz auf vertikalen Bildlauf um, so funktionierts nämlich überall prima. Seltsam, dass es bei dir im IE funktioniert hat (kann ich fast nicht glauben, wenn ich’s nicht gesehen habe :wink:

Nichts desto trotz besten Dank für deine Hilfe und
n’ angenehmes Wochenende
Gruss
Patrick

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]