Versuch DIV Suppe zu vermeiden

[Yojimbo]

Hallo allerseits.

Nach zwei Stunden Suchfunktion und Google habe ich den Entschluss gefasst mein Problem hier einfach zu posten. Gleich mal vorweg: Ich bin mir nahezu 100% sicher, dass es zu diesem meinem Problem einige passende Beiträge gibt und ich entschuldige mich tausendmal, dass ich diese übersehen habe bzw. nicht begriffen habe, dass diese beiträge mit meinem Problem zu tun haben. Aus den FAQs und Tutorials werde ich auch nicht schlau bzw. kann die für mich relevante Info nicht extrahieren. Den Grund dafür seht Ihr in der Art wie ich das Problem im unteren Link geschildert habe.

Wenn es passende threads dazu gibt bitte ich höflichst um einen link dorthin.

Nun ohne weitere Umschweife mein Problem: http://img245.imageshack.us/img245/1654/dasproblem.gif <- ein Bild sagt mehr als tausend Worte.

Danke vielmals im voraus.
Y

[suit]

ein Bild sagt mehr als tausend Worte.

Ein Online-Beispiel sagt mehr als tausend Bilder.

[Bassist]

ein Bild sagt mehr als tausend Worte.
Ein Online-Beispiel sagt mehr als tausend Bilder.

=> Absolut keine Hilfe, ich weis was er meint!

Versuch das ganze mal mit einer Tabelle. Du kannst Zellen miteinander http://de.selfhtml.org/html/tabellen/zellen_verbinden.htm@title=verbinden und somit dein gewünschtes Layout erhalten.

MFG

bassist

[EKKi]

Mahlzeit Bassist,

=> Absolut keine Hilfe, ich weis was er meint!

Warum hilfst Du ihm dann nicht?

Versuch das ganze mal mit einer Tabelle. Du kannst Zellen miteinander http://de.selfhtml.org/html/tabellen/zellen_verbinden.htm@title=verbinden und somit dein gewünschtes Layout erhalten.

Zitat 1068

bassist

Schuster, bleib bei Deinen Leisten ... ;-)

MfG,
EKKi

[Bassist]

Warum hilfst Du ihm dann nicht?

Siehe weiter unten in meinem post

Zitat 1068

Schuster, bleib bei Deinen Leisten ... ;-)

Man kann Sich auch das Leben schwer machen und im Layout stehen doch wohl alle Daten in relation zueinander oder nicht? => Tabelle passt.

MFG

Bassist

[suit]

Man kann Sich auch das Leben schwer machen und im Layout stehen doch wohl alle Daten in relation zueinander oder nicht? => Tabelle passt.

Ja, aber nicht in der linearen Abfolge, wie sie eine Tabelle bietet. =>  Tabelle passt nicht.

[Yojimbo]

Um der ganzen Sache mehr Klarheit zu verschaffen, da mein Bildchen doch nicht ganz eindeutig gewesen zu sein scheint, hier verbale Erläuterungen dazu:

Das blaue DIV soll nach oben verrückt werden, dass es genau wie das grüne und das graue DIV in einer Linie an das schwarze DIV anschließt.

Bleibt noch zu sagen, dass ich weder Tabellen noch absolute positioning verwenden möchte. Danke aber dennoch für die Vorschläge.

@bleicher:

Grau in rot packen wie du meinst wäre genau das was ich nicht will nämlich um zwei DIVs ein Über-DIV zu ziehen. Danke aber auch für diesen Ansatz.

Zur Sicherheit nochmal der Link zu meinem Problem: http://img245.imageshack.us/img245/1654/dasproblem.gif

Falls alles nichts hilft verpack ich halt die zwei mittleren DIVs in großes Überding.

mfg
Y

[ChrisB]

Hi,

Das blaue DIV

... will noch mal überdacht haben, ob es wirklich ein DIV sein sollte (von wegen Thema).

soll nach oben verrückt werden, dass es genau wie das grüne und das graue DIV in einer Linie an das schwarze DIV anschließt.

Wenn es im Quelltext einfach nach dem Grünen stehen würde, dann täte es das von selbst, wenn es nach rechts gefloatet wird.

MfG ChrisB

[Yojimbo]

Hi

Das blaue DIV

... will noch mal überdacht haben, ob es wirklich ein DIV sein sollte (von wegen Thema).

Ich verstehe nicht ganz. Was soll es sonst werden? Ich brauche blau als Kontainer.

soll nach oben verrückt werden, dass es genau wie das grüne und das graue DIV in einer Linie an das schwarze DIV anschließt.

Wenn es im Quelltext einfach nach dem Grünen stehen würde, dann täte es das von selbst, wenn es nach rechts gefloatet wird.

Du meinst die Reihenfolge der DIV Tags im HTML entscheidet darüber. Hab's grad getestet aber wenn blau nach rechts floatet pickt es - wie nicht anders zu erwarten - am Rechtenbildschirmrand, was es nicht soll.

Grün, Grau, Rot und Blau sollen senkrecht aneinander picken und waagrecht an schwarz.

mfg
Y

[ChrisB]

Hi,

Das blaue DIV

... will noch mal überdacht haben, ob es wirklich ein DIV sein sollte (von wegen Thema).

Ich verstehe nicht ganz. Was soll es sonst werden? Ich brauche blau als Kontainer.

Kontainer für was? (Inhalt?)

Wenn es im Quelltext einfach nach dem Grünen stehen würde, dann täte es das von selbst, wenn es nach rechts gefloatet wird.

Du meinst die Reihenfolge der DIV Tags im HTML entscheidet darüber.

Die entscheidet natürlich (mit) darüber, welche Elemente als vor/über und welche als nach/unter einem gefloateten Element im Fluss kommende betrachtet werden.

Hab's grad getestet aber wenn blau nach rechts floatet pickt es - wie nicht anders zu erwarten - am Rechtenbildschirmrand, was es nicht soll.

Siehst du, auch das kam in deiner Problembeschreibung bisher noch gar nicht vor - also beschreibe bitte demnächst gleich von Anfang an ausführlicher!

Das liesse sich ja durchaus beheben, wenn man dem umgebenden Element eine (Maximal-)Breite geben würde.

MfG ChrisB

[Yojimbo]

Kontainer für was? (Inhalt?)

img buttons Was spielt das für eine Rolle wenn ich sage ich will dieses DIV?

Hab's grad getestet aber wenn blau nach rechts floatet pickt es - wie nicht anders zu erwarten - am Rechtenbildschirmrand, was es nicht soll.
Siehst du, auch das kam in deiner Problembeschreibung bisher noch gar nicht vor - also beschreibe bitte demnächst gleich von Anfang an ausführlicher!

Ich würde selbst bei nochmaliger Betrachtung meines Problembildchens sagen, dass das es relativ selbsterklärend ist, zumal zwei Erläuterungen angeführt sind. Dass ein einzelnes DIV vollständig abseits von den restlichen DIVs vom Autor bewusst am rechten Bildschirmrand haften und damit ein recht abstruses Design verursachen soll ist zwar streng genommen möglich aber nicht wahrscheinlich speziell wenn man den mainstreamhaften Designansatz betrachtet und Punkt 1 sowie Punkt 2 im Bild zusammen liest. Wenn ich wollte dass das rechte DIV rechts floatet hätte ich den Pfeil auch nach rechts zeigen lassen und nicht nach oben. Was im übrigen der eigentliche Zweck des Bildes war: keine Romane schreiben zu müssen. Für mich war es einfacher das Ganze so darzustellen aber offenbar können sich nicht alle etwas darunter vorstellen. Sorry dafür. Aber wie gesagt finde ich diese Art der Problemdarstellung in solch simplen Fällen nicht nur für mich noch immer praktikabler und als Romane schreiben bei denen mitunter ganze 5 posts hin und her geschrieben werden müssen bis alle Beteiligten das Problem verstanden haben. Wie verständlich eine Problemstellung für die Leserschaft ist hängt zwar durchaus vom Autor des Textes ab, dasselbe gilt aber genauso für die bildliche Darstellung. Es wird so oft nach der URL der jeweiligen Problemseite verlangt. Wozu? Doch auch nur um sich das Problem buchstäblich vor Augen führen zu können.

Das liesse sich ja durchaus beheben, wenn man dem umgebenden Element eine (Maximal-)Breite geben würde.

Wenn du mit umgebenden Element ein Über-DIV meinst, ich denke es wurde oft genug erwähnt, dass das nicht erwünscht ist, weil ich DIV Suppen vermeiden will. Ich nehme das mal aber jetzt nicht an, weil es nach so vielen Erwähnungen nicht wahrscheinlich ist, dass du mit umgebendes Element ein Über-DIV meinst. Dann stellt sich mir die Frage was sonst meinst du damit? Das gesamte HTML bzw. den BODY mit einer Maximalbreite versehen?

Nebengedanke: Warum müssen Leute, die um Hilfe bitten sich ständig wegen formeller Sachen wie z.B. Darstellungsweise des Problems rechtfertigen? Ich war selbst eine Zeit lang im internen Supportbereich tätig und mir wäre nie in den Sinn gekommen Leuten, die bei mir anrufen, genervt anzuschnauzen, weil sie sich am Telefon nicht zuerst mit ihrer Personalnummer melden bzw. ihre Probleme nicht so darstellen, wie es gerade für mich bequem wäre. Wie oft ich den usern pro Tag "Bitte lesen Sie mir Ihre genaue Fehlermeldung vor." sagen musste, so viele Atemzüge kann ich in einem Fußballmatch als Flügelspieler gar nicht machen. Selbst wenn es nervt und ich ohne diese Meldungen keinen Support leisten kann, würde ich dem User niemals sagen: "Von nun an wenn Sie Hilfe wollen melden Sie sich zuerst mit Ihrer Personalnummer und Ihrer Fehlermeldung und nicht anders." Mir ist klar, dass das hier nicht als professioneller Support gedacht ist sondern als Internetcommunity mit keinerlei Zwang und Verpflichtung. Auch tut es mir leid, dass mein Problem nicht auf den ersten Blick verständlich war. Aber bitte, keine "schreib gleich von Anfang an ausführlicher" Kommentare mehr sondern nur die Lösungsansätze bzw. bei Fragen nur die Fragen. Ist doch niemand gezwungen hier zu helfen. Nachdem das gesagt worden ist, danke ich dir für deine bisherigen Bemühungen.

Grüße
Y

[Der Martin]

Hallo,

Ich würde selbst bei nochmaliger Betrachtung meines Problembildchens sagen, dass das es relativ selbsterklärend ist, zumal zwei Erläuterungen angeführt sind.

das würde ich nicht sagen. Ich habe mehrere Minuten gebraucht, um aus der Skizze und den Anmerkungen zu verstehen, was du (vermutlich) willst. Angaben wie "das da" oder "da rauf" sind, auch wenn sie mit Pfeilen verdeutlicht werden, einfach ungünstig. Es heißt zwar, ein Bild sage mehr als tausend Worte - in deinem Fall wären aber zwei Bilder sinnvoll gewesen: Eines vom status quo, wie du es schon zur Verfügung gestellt hast, und eines vom gewünschten Zustand, das man ja mit einem einfachen Grafikprogramm in Minutenschnelle erreicht hätte. Alternativ das eine Bild, das du hast, und eine *verständliche* Beschreibung in Worten.

Was im übrigen der eigentliche Zweck des Bildes war: keine Romane schreiben zu müssen.

Das ging aus meiner Sicht gründlich daneben. Ein kurzer "Roman" dazu hätte das Ganze wesentlich klarer machen können.

Es wird so oft nach der URL der jeweiligen Problemseite verlangt. Wozu? Doch auch nur um sich das Problem buchstäblich vor Augen führen zu können.

Damit man nicht nur das Ergebnis vor Augen hat, das du nur als Screenshot präsentierst, sondern gleich nachsehen kann, wie es zustandekommt (Quellcode), und Hilfestellungen oder Ratschläge gleich auf dem vorhandenen Quellcode aufbauen kann.

Dann stellt sich mir die Frage was sonst meinst du damit? Das gesamte HTML bzw. den BODY mit einer Maximalbreite versehen?

Ja, warum nicht?

Nebengedanke: Warum müssen Leute, die um Hilfe bitten sich ständig wegen formeller Sachen wie z.B. Darstellungsweise des Problems rechtfertigen?

Weil die Qualität der Hilfe wesentlich davon abhängt, ob und wie gut der Helfer das Problem überhaupt verstanden hat. Je exakter und weniger missverständlich die Frage oder Beschreibung, desto besser. Ist sie so ungenau oder mehrdeutig, dass man nachfragen muss, bittet man den Fragesteller schon mal, sich besser (richtiger) auszudrücken. Fachsprache ist beispielsweise nicht immer nötig - aber wenn sie verwendet wird, dann bitte richtig. Meine Mutter ist auch so eine: Wenn sie ein Problem am PC hat und mir dieses Problem schildert, verwendet sie gern irgendwelche Fachtermini, die "interessant" klingen, aber im falschen Kontext nur verwirren. Dann bitte ich sie auch, die Sache nur in ganz alltäglichen Worten zu beschreiben.

Ich war selbst eine Zeit lang im internen Supportbereich tätig [...]
Selbst wenn es nervt und ich ohne diese Meldungen keinen Support leisten kann, würde ich dem User niemals sagen: "Von nun an wenn Sie Hilfe wollen melden Sie sich zuerst mit Ihrer Personalnummer und Ihrer Fehlermeldung und nicht anders." Mir ist klar, dass das hier nicht als professioneller Support gedacht ist sondern als Internetcommunity mit keinerlei Zwang und Verpflichtung.

Genau das ist der Punkt - hier helfen Leute freiwillig, und nicht gegen Bezahlung, die dem Fragesteller einen Anspruch einräumt.

Aber bitte, keine "schreib gleich von Anfang an ausführlicher" Kommentare mehr

Und ich dachte, genau *diese* Bitte wäre schließlich angekommen ...

Ciao,
 Martin

[ChrisB]

Hi,

Kontainer für was? (Inhalt?)

img buttons Was spielt das für eine Rolle wenn ich sage ich will dieses DIV?

Das fragst du angesichts des Thread-Titels, den du gewählt hast, jetzt doch aber nicht ernsthaft?

"img buttons" bedeutet wohl Navigation, Navigation bedeutet Auflistung von Links, und die bedeutet UL/OL.

Also wirst du dieses Listenelement wie gewünscht formatieren, und nicht noch ein vollkommen überflüssiges DIV drumherum bauen.

*Sowas* gehört mit zur Vermeidung von DIV-Suppe.

Ich würde selbst bei nochmaliger Betrachtung meines Problembildchens sagen, dass das es relativ selbsterklärend ist, zumal zwei Erläuterungen angeführt sind.

Das liegt daran, dass *du* dieses Bildchen erstellt hast.
*Du* kennst dein Problem schon so ausreichend gut, dass dir gewisse Dinge "selbstverständlich" erscheinen, und du sie deshalb gar nicht mehr erwähnst.
Da *wir* aber nicht in deinem Kopf wohnen, kennen wir das Problem noch weitaus weniger gut. Und deshalb ist für uns nicht alles so offensichtlich, wie für dich.
Und deshalb versuche bitte, dein Problem beim nächsten Mal gleich mindestens so ausführlich (auch) verbal zu erklären, dass es auch für Leute, die nicht du sind, nachvollziehbar wird.

Dass ein einzelnes DIV vollständig abseits von den restlichen DIVs vom Autor bewusst am rechten Bildschirmrand haften und damit ein recht abstruses Design verursachen soll ist zwar streng genommen möglich aber nicht wahrscheinlich

Dass du nicht dafür gesorgt hast, dass ein Containerelement aller Inhaltselemente schon die Breite soweit vorgibt, dass Floating eben nicht "am Bildschirmrand" bedeutet, war aus deinem Bildchen auch nicht zu erkennen.
(Dass du auch dort zu "gezeig" für ein DIV-Element warst, welches *alle* Inhalte gruppiert und dieses entsprechend formatiert hättest, war in Verbindung mit dem Thread-Titel zwar eventuell erahnbar - aber es muss ja auch kein zusätzliches DIV-Element sein, welches man dieser Formatierung unterzieht, denn schliesslich haben die Inhalte noch andere Vorfahrenelemente gemeinsam.)

Was im übrigen der eigentliche Zweck des Bildes war: keine Romane schreiben zu müssen. Für mich war es einfacher das Ganze so darzustellen aber offenbar können sich nicht alle etwas darunter vorstellen.

Ja, siehe oben.

Und selbst wenn ich mir etwas „darunter vorstelle” - dann ist es vielleicht etwas anderes, als was du dir darunter vorstellst. Und dann fange ich an, nach Lösungen für Probleme zu suchen, die gar nicht exakt genug dem vorliegenden entsprechen, und gebe vielleicht Tipps, die du nur mit "Das hilft mir nicht weiter, weil ..." kommentieren kannst. Und deshalb hätten wir eben dieses „weil” schon vorher in hinreichendem Maße klären sollen.

Aber wie gesagt finde ich diese Art der Problemdarstellung in solch simplen Fällen nicht nur für mich noch immer praktikabler und als Romane schreiben bei denen mitunter ganze 5 posts hin und her geschrieben werden müssen bis alle Beteiligten das Problem verstanden haben.

Hier diskutieren wir aber auch schon länger darüber, was genau du eigentlich gemeint hast.
Dein "nur Bild, ohne Roman"-Ansatz hat diesbezüglich also keinerlei Besserung gebracht.

Ich vermute, im Gegenteil wäre der Ansatz "Roman, unterstützt durch Bildchen" erfolgreicher gewesen; wobei "Roman" natürlich noch durch "so ausführlich wie nötige, aber so kurz wie mögliche Formulierung" ersetzt gehört.

Wie verständlich eine Problemstellung für die Leserschaft ist hängt zwar durchaus vom Autor des Textes ab, dasselbe gilt aber genauso für die bildliche Darstellung.

Und die hat der Autor in diesem Falle nicht so hingekriegt, dass sie ausreichend verständlich gewesen wäre.

Es wird so oft nach der URL der jeweiligen Problemseite verlangt. Wozu? Doch auch nur um sich das Problem buchstäblich vor Augen führen zu können.

Wenn mir ein URL genannt wird, kann ich mir auch den Quelltext anschauen; ich sehe, welche Elemente im HTML verwendet werden, und wie sie mit CSS formatiert werden - und kann beurteilen, was daran ggf. "falsch" ist bzw. was besser gemacht werden könnte.

All das bietet ein Bild nicht.

Das ist nur so brauchbar, als wie wenn du mit einem Foto vom Unfallwagen in die Werkstatt gehst und fragst, was es dich unterm Strich kosten wird, „alles wieder ganz machen” zu lassen. Gut, den Totalschaden wird man vielleicht auch auf dem Foto hinreichend gut beurteilen können - aber bei kleineren Sachen, da wird dir kein Mechaniker definitiv sagen können, was „unter der Haube” noch alles kaputt gegangen ist, was sich am Fahrgestell ggf. verzogen hat, etc.

Nebengedanke: Warum müssen Leute, die um Hilfe bitten sich ständig wegen formeller Sachen wie z.B. Darstellungsweise des Problems rechtfertigen?

Weil sie *bitte* spätestens jetzt, nach den bisher erfolgten Erklärungen, eingesehen haben, dass auch das Formale dazu beiträgt, wie gut und/oder schnell sich ein Problem lösen lässt.
[Dass meine aktuelle Signatur hier so gut passt, ist ein netter Zufall.]

Ich war selbst eine Zeit lang im internen Supportbereich tätig und mir wäre nie in den Sinn gekommen Leuten, die bei mir anrufen, genervt anzuschnauzen, weil sie sich am Telefon nicht zuerst mit ihrer Personalnummer melden bzw. ihre Probleme nicht so darstellen, wie es gerade für mich bequem wäre. Wie oft ich den usern pro Tag "Bitte lesen Sie mir Ihre genaue Fehlermeldung vor." sagen musste, so viele Atemzüge kann ich in einem Fußballmatch als Flügelspieler gar nicht machen.

Am Telefon hat der Nutzer, der zum ersten Mal anruft, iaR. keinerlei „Checkliste” vorliegen, welche Informationen er parat haben und wie er sie präsentieren sollte - da bleibt dir als Supporter nichts anderes übrig, als durch beständiges Rückfragen die Informationen einzuholen, die du benötigst, um dem Anrufer weiterhelfen zu können.

Hier im SELFFORUM schränkt uns das Medium aber nicht so ein - du hast die Möglichkeit, dich vor dem Fragen zu informieren, welche Informationen du mindestens liefern solltest, um das Problem nachvollziehbar zu beschreiben - das ist in den Tipps für Fragende erklärt. (Und die gelesen zu haben, bestätigt man vor dem Posten hier übrigens explizit.)

Aber bitte, keine "schreib gleich von Anfang an ausführlicher" Kommentare mehr sondern nur die Lösungsansätze bzw. bei Fragen nur die Fragen. Ist doch niemand gezwungen hier zu helfen.

Und eben deshalb solltest du dankbar sein, wenn du hier auch Tipps und Hinweise bekommst, wie du deine Problembeschreibungen verbessern kannst - denn dann ist die Wahrscheinlichkeit, dass jemand hier dir auch in Zukunft „ohne Zwang” gerne weiterzuhelfen versuchen wird, sehr viel höher, als wenn es immer wieder erst langer Frage-Antwort-Spielchen bedarf, bis endlich erst mal alle relevanten Informationen vorliegen.

Nachdem das gesagt worden ist, danke ich dir für deine bisherigen Bemühungen.

Bitte, gern geschehen. Ehrlich.

MfG ChrisB

[EKKi]

Mahlzeit Bassist,

Warum hilfst Du ihm dann nicht?

Siehe weiter unten in meinem post

Das ist keine Hilfe ...

Man kann Sich auch das Leben schwer machen und im Layout stehen doch wohl alle Daten in relation zueinander oder nicht? => Tabelle passt.

Besteige die nächstgelegene Zeitmaschine, reise vom zweiten ins dritte Jahrtausend und informiere Dich zum Thema "Tabellenlayout".

MfG,
EKKi

[ChrisB]

Hi,

=> Absolut keine Hilfe, ich weis was er meint!

Nein, tust du nicht -

Versuch das ganze mal mit einer Tabelle.

• sonst müsstest du wissen, warum jemand, der sich über den Begriff "DIV-Suppe" Gedanken macht, ganz bestimmt keine Tabelle zu Layoutzwecken missbrauchen will.

Ergänzend zu EKKis Link auf einen Eintrag in der hiesigen Sammlung, möchte ich deshalb auch noch auf das bekannte Zitat von Dieter Nuhr verweisen.

MfG ChrisB

[ChrisB]

Hi,

Nun ohne weitere Umschweife mein Problem: http://img245.imageshack.us/img245/1654/dasproblem.gif <- ein Bild sagt mehr als tausend Worte.

Es müssen keine Tausend werden, aber ein wenig wirst du dein Problem wohl auch noch verbal beschreiben müssen ...

Das in deinem Bildchen blaue Element soll also in den schwarzen Kopfbereich mit hinein?
Dann wäre der erste Vorschlag absolute Positionierung.

MfG ChrisB

[bleicher]

Grüße,
und wen du grau IN rot packst?
MFG
bleicher