Problem bei wrapping in flex container – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self Problem bei wrapping in flex container Sun, 12 Nov 17 17:09:02 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708206#m1708206 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708206#m1708206 <p>Hallo,</p> <p>ich habe eine Seite erstellt, bei der abwechselnd einmal links Foto, rechts Text und dann wieder rechts Foto, links Text angeordnet ist. Soweit so gut. Es sieht alles nicht schlecht aus. Allerdings möchte ich, dass ab einer bestimmten Fensterbreite das Bild über den Text "wrapt"/rutscht. Hab das aktuell mit min-width beim Bild gelöst, was aber nicht ideal ist, da ich es variabel halten möchte.</p> <p>Hier mein Code: <a href="https://jsfiddle.net/u1my9xh3/" rel="noopener noreferrer">https://jsfiddle.net/u1my9xh3/</a></p> <p>Hier die Seite, auf der es "richtig" funktioniert: <a href="http://bit.ly/2zBoskE" rel="nofollow noopener noreferrer">http://bit.ly/2zBoskE</a></p> <p>Ab ca. 700px Breite wird das Bild nach oben gesetzt und vergrößert sich dann wieder, ehe es wieder kleiner wird.</p> <p>Kann mir hier jemand helfen? Hab leider keine Ahnung wie die das gelöst haben…</p> <p>Danke!</p> Problem bei wrapping in flex container Sun, 12 Nov 17 19:14:31 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708210#m1708210 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708210#m1708210 <p>Hallo Christian,</p> <blockquote> <p>Kann mir hier jemand helfen? Hab leider keine Ahnung wie die das gelöst haben…</p> </blockquote> <p>Die ultrakurze Antwort lautet: Mit <a href="https://wiki.selfhtml.org/wiki/CSS/Media_Queries" rel="nofollow noopener noreferrer">mediaqueries</a></p> <p>Dein HTML ist fehlerhaft und stark verbesserungswürdig.</p> <pre><code class="block bad language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>intro block<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>content<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">text-align</span><span class="token punctuation">:</span> center<span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h2</span><span class="token punctuation">></span></span>Tipps zu eurer<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h2</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>br</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h1</span><span class="token punctuation">></span></span>Hochzeitsplanung<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h1</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>Überschriften dürfen nicht in Absätzen notiert werden, "Tipps zu eurer" ist garantiert keine Überschrift, du verwendest sie zudem sehr inflationär.</p> <p>Nicht jedes gruppierende Element sollte ein <code>div</code> sein. <code>section</code> und <code>article</code> existieren.</p> <p>br-Elemente sind für Zeilenumbrüche in Gedichten gedacht.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> Problem bei wrapping in flex container Sun, 12 Nov 17 21:49:41 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708216#m1708216 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708216#m1708216 <p>@@Christian</p> <blockquote> <p>Hab leider keine Ahnung wie die das gelöst haben…</p> </blockquote> <p>Grauenhaft. div-Suppe; Inline-Styles, …</p> <p>Ich kann mir das nicht näher ansehen, dazu müsste ich meinen Würgreiz unterdrücken können.</p> <p>Ich würde das <a href="https://codepen.io/gunnarbittersmann/pen/vWmpoB" rel="noopener noreferrer">auf die Art</a> machen.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 08:05:57 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708230#m1708230 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708230#m1708230 <p>Hallo Christian,</p> <blockquote> <p>...auf der es "richtig" funktioniert...</p> </blockquote> <p>tut es nicht. Mit "JavaScript only" ist es wie weiland mit "Flash"; wer sich nicht darauf einlässt - und das mit gutem Grund - sieht schlicht: Nichts.</p> <p>Grüße, Martl</p> Problem bei wrapping in flex container Sun, 12 Nov 17 22:56:58 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708220#m1708220 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708220#m1708220 <p>@@Gunnar Bittersmann</p> <blockquote> <p>Ich würde das <a href="https://codepen.io/gunnarbittersmann/pen/vWmpoB" rel="noopener noreferrer">auf die Art</a> machen.</p> </blockquote> <p>Oder doch nicht, sondern <a href="https://codepen.io/gunnarbittersmann/pen/ZaKxXE" rel="noopener noreferrer">auf jene Art</a>: mit Grid.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 06:12:51 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708223#m1708223 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708223#m1708223 <p>@@Gunnar Bittersmann</p> <blockquote> <blockquote> <p>Ich würde das <a href="https://codepen.io/gunnarbittersmann/pen/vWmpoB" rel="noopener noreferrer">auf die Art</a> machen.</p> </blockquote> <p>Oder doch nicht, sondern <a href="https://codepen.io/gunnarbittersmann/pen/ZaKxXE" rel="noopener noreferrer">auf jene Art</a>: mit Grid.</p> </blockquote> <p>Oder doch nicht. Wenn man ein Grid will, will man <em>ein</em> Grid. <a href="https://codepen.io/gunnarbittersmann/pen/ZaKojX" rel="noopener noreferrer">Bitteschön.</a></p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 08:27:53 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708232#m1708232 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708232#m1708232 <p>Hej Gunnar,</p> <blockquote> <p>@@Gunnar Bittersmann</p> <blockquote> <p>Ich würde das <a href="https://codepen.io/gunnarbittersmann/pen/vWmpoB" rel="noopener noreferrer">auf die Art</a> machen.</p> </blockquote> <p>Oder doch nicht, sondern <a href="https://codepen.io/gunnarbittersmann/pen/ZaKxXE" rel="noopener noreferrer">auf jene Art</a>: mit Grid.</p> </blockquote> <p>Geht bei mir nicht (Win10/Edge 15)</p> <p>Marc</p> Problem bei wrapping in flex container Mon, 13 Nov 17 09:15:42 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708238#m1708238 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708238#m1708238 <p>@@Martl</p> <blockquote> <blockquote> <p>...auf der es "richtig" funktioniert...</p> </blockquote> <p>tut es nicht. Mit "JavaScript only" ist es wie weiland mit "Flash"; wer sich nicht darauf einlässt - und das mit gutem Grund - sieht schlicht: Nichts.</p> </blockquote> <p>Nicht nur wer sich nicht darauf einlässt (JavaScript-Ausschalter sind womöglich gar eine zu vernachlässigende Gruppe), sondern auch alle, bei denen JavaScript nicht ausgeführt wird, weil</p> <ul> <li>es wegen abgebrochener Netzwerkverbindung nicht geladen wird</li> <li>eingebundene fehlerhafte Third-Party-Scripte die Ausführung der eigenen Scripte verhindern</li> <li>…</li> </ul> <p>Ich habe mir die fragliche Seite jetzt nicht ohne JS angesehen, aber wenn man dann tatsächlich nichts sieht, ist es Unvermögen der Entwickler.</p> <p>JavaScript lässt sich vortrefflich als <em lang="en">progressive enhancement</em> einsetzen Beispiel: <a href="https://codepen.io/gunnarbittersmann/pen/QGZVmd" rel="noopener noreferrer">ein ähnlicher Fall</a>, wo die Breite anhand eines bestimmten Inhalts gesetzt wird – wobei auch dort <code>min-content</code> <a href="https://codepen.io/gunnarbittersmann/pen/YpJdRm" rel="noopener noreferrer">zum Ziel führt</a>.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 09:21:34 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708239#m1708239 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708239#m1708239 <p>@@marctrix</p> <blockquote> <blockquote> <p>Oder doch nicht, sondern <a href="https://codepen.io/gunnarbittersmann/pen/ZaKxXE" rel="noopener noreferrer">auf jene Art</a>: mit Grid.</p> </blockquote> <p>Geht bei mir nicht (Win10/Edge 15)</p> </blockquote> <p>Geht bei mir problemlos – und bei dir wohl auch! Alle Bilder und Textinhalte werden dargestellt. <a href="http://dowebsitesneedtolookexactlythesameineverybrowser.com/" lang="en" rel="nofollow noopener noreferrer">Do websites need to look exactly the same in every browser?</a></p> <p>Wieso eigentlich immer noch Edge 15? <a href="https://caniuse.com/#feat=css-grid" rel="noopener noreferrer">Can I use</a> meint, der 16er wäre schon draußen und kann Grid.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 10:10:48 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708246#m1708246 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708246#m1708246 <p>Hallo Gunnar,</p> <blockquote> <p>...zu vernachlässigende Gruppe</p> </blockquote> <p>woher Du Weisheit diese nehmen?</p> <p>Grüße, Martl</p> <p>(<em>Yoda, ungesicherte Zitate: Binsenweisheiten meist ohne tiefere Bedeutung für das Leben sind</em>.)</p> Problem bei wrapping in flex container Mon, 13 Nov 17 17:19:49 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708272#m1708272 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708272#m1708272 <p>@@Gunnar Bittersmann</p> <blockquote> <ul> <li>eingebundene fehlerhafte Third-Party-Scripte die Ausführung der eigenen Scripte verhindern</li> </ul> </blockquote> <p>Gerade vor einer Woche live gesehen: Irgendeins von Heydon Pickerings <a href="http://heydonworks.com/practical_aria_examples/" rel="nofollow noopener noreferrer">ARIA-Beispielen</a> funktionierte nicht richtig. Das JavaScript zickte rum. Es stellte sich raus, dass ein von Disqus eingebundenes Script die Ausführung des eigenen blockierte. WTF.</p> <p>Kaum hat er Disqus rausgeschmissen, ging alles wie gewollt.</p> <p>LLAP </p> <p>PS: Disqus sollte man wohl sowieso rausschmeißen. Das dient nicht dazu, Diskussionen zu Artikeln zu ermöglichen, sondern dazu, Nutzer zu tracken. <a href="https://medium.com/patrickleenyc/beware-of-disqus-17fb58cfab10" lang="en" rel="nofollow noopener noreferrer">Beware of Disqus!</a></p> <p>PPS: Heydon meinte, seine ARIA-Beispiele können wir sowieso vergessen und uns besser seinen <a href="https://inclusive-components.design/" lang="en" rel="noopener noreferrer">Inclusive Components </a> widmen. </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 09:37:49 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708241#m1708241 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708241#m1708241 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <blockquote> <p>Oder doch nicht, sondern <a href="https://codepen.io/gunnarbittersmann/pen/ZaKxXE" rel="noopener noreferrer">auf jene Art</a>: mit Grid.</p> </blockquote> <p>Geht bei mir nicht (Win10/Edge 15)</p> </blockquote> <p>Geht bei mir problemlos – und bei dir wohl auch! Alle Bilder und Textinhalte werden dargestellt. <a href="http://dowebsitesneedtolookexactlythesameineverybrowser.com/" lang="en" rel="nofollow noopener noreferrer">Do websites need to look exactly the same in every browser?</a></p> </blockquote> <p>Du hast wohl die ursprüngliche Fragestellung ein wenig aus den Augen verloren? Der OP wollte wissen, wie man dafür sorgt, dass die Bilder mal neben, mal über dem Text stehen. <em>Geht bei mir nicht</em> bezog sich auf das hier gestellte Problem. </p> <p>Und ja, es ist durchaus in Ordnung, wenn Webseiten hier und da unterschiedlich sind. Es ist aber auch in Ordnung, wenn so eine grundlegende Designentscheidung durchgezogen wird. Es verwirrt auch, wenn Webseiten <strong>stark</strong> unterschiedlich dargestellt werden, wenn man den UA wechselt.</p> <blockquote> <p>Wieso eigentlich immer noch Edge 15? <a href="https://caniuse.com/#feat=css-grid" rel="noopener noreferrer">Can I use</a> meint, der 16er wäre schon draußen und kann Grid.</p> </blockquote> <p>Ist eine Vorgabe meines Dienstherren und kann von mir nicht beeinflusst werden.</p> <p>Marc</p> Problem bei wrapping in flex container Mon, 13 Nov 17 09:44:46 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708242#m1708242 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708242#m1708242 <p>@@marctrix</p> <blockquote> <p>Du hast wohl die ursprüngliche Fragestellung ein wenig aus den Augen verloren?</p> </blockquote> <p>Nö …</p> <blockquote> <p>Der OP wollte wissen, wie man dafür sorgt, dass die Bilder mal neben, mal über dem Text stehen.</p> </blockquote> <p>Die Antwort auf diese Frage ist: nicht überall.</p> <blockquote> <p>Es verwirrt auch, wenn Webseiten <strong>stark</strong> unterschiedlich dargestellt werden, wenn man den UA wechselt.</p> </blockquote> <p>Ich vergleiche jetzt mal, wie die Webseite auf demselben Gerät in verschiedenen Browsern angezeigt wird. —kein Nutzer, jemals</p> <blockquote> <blockquote> <p>Wieso eigentlich immer noch Edge 15? <a href="https://caniuse.com/#feat=css-grid" rel="noopener noreferrer">Can I use</a> meint, der 16er wäre schon draußen und kann Grid.</p> </blockquote> <p>Ist eine Vorgabe meines Dienstherren und kann von mir nicht beeinflusst werden.</p> </blockquote> <p>In meiner VM läuft auch noch der 15er, deshalb die Frage. Ist Can I Use da etwas vorschnell?</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 19:20:22 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708282#m1708282 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708282#m1708282 <p>Hallo marctrix,</p> <blockquote> <blockquote> <p>Wieso eigentlich immer noch Edge 15? <a href="https://caniuse.com/#feat=css-grid" rel="noopener noreferrer">Can I use</a> meint, der 16er wäre schon draußen und kann Grid.</p> </blockquote> </blockquote> <p>Offensichtlich hat MS den 16er noch nicht an alle verteilt, ich hab auch noch den 15er und automatische Updates.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> Problem bei wrapping in flex container Mon, 13 Nov 17 09:55:02 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708243#m1708243 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708243#m1708243 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Du hast wohl die ursprüngliche Fragestellung ein wenig aus den Augen verloren?</p> </blockquote> <p>Nö …</p> <blockquote> <p>Der OP wollte wissen, wie man dafür sorgt, dass die Bilder mal neben, mal über dem Text stehen.</p> </blockquote> <p>Die Antwort auf diese Frage ist: nicht überall.</p> </blockquote> <p>Verstehe ich nicht. Was willst du mir damit sagen?</p> <blockquote> <blockquote> <p>Es verwirrt auch, wenn Webseiten <strong>stark</strong> unterschiedlich dargestellt werden, wenn man den UA wechselt.</p> </blockquote> </blockquote> <blockquote> <p>Ich vergleiche jetzt mal, wie die Webseite auf demselben Gerät in verschiedenen Browsern angezeigt wird. —kein Nutzer, jemals</p> </blockquote> <p>Wieso gleiches Gerät? Ich habe ein iPhone, ein iPad, einen Mac. Sähe alles gleich aus. Dann gehe ich zur Arbeit und setze mich an einen Win10-PC - und sehe eine Webseite, die so fremd aussieht, dass ich erst mal in der Adressleiste nachschauen muss, ob ich auf selfhtml.de oder selhtml.org gelandet bin…</p> <p>Viele Nutzer. Dauernd!</p> <p>Auch wenn es bei anderen Android und Windows sein mag, dafür mag der Wechsel noch häufiger stattfinden, weil es eben kein ChromeOS gibt, auf dem die gewohnten Desktop-Anwendungen laufen</p> <blockquote> <blockquote> <blockquote> <p>Wieso eigentlich immer noch Edge 15? <a href="https://caniuse.com/#feat=css-grid" rel="noopener noreferrer">Can I use</a> meint, der 16er wäre schon draußen und kann Grid.</p> </blockquote> <p>Ist eine Vorgabe meines Dienstherren und kann von mir nicht beeinflusst werden.</p> </blockquote> <p>In meiner VM läuft auch noch der 15er, deshalb die Frage. Ist Can I Use da etwas vorschnell?</p> </blockquote> <p>Wie auch immer. Wird sich bei uns nicht so schnell ändern, fürchte.</p> <p>Marc</p> Problem bei wrapping in flex container Mon, 13 Nov 17 10:26:30 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708247#m1708247 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708247#m1708247 <p>@@marctrix</p> <blockquote> <blockquote> <blockquote> <p>Der OP wollte wissen, wie man dafür sorgt, dass die Bilder mal neben, mal über dem Text stehen.</p> </blockquote> <p>Die Antwort auf diese Frage ist: nicht überall.</p> </blockquote> <p>Verstehe ich nicht. Was willst du mir damit sagen?</p> </blockquote> <p>Dass man mit Stakeholdern am besten von vornherein klärt, dass das Endprodukt überall <em>gut</em>, aber nicht überall <em>gleich</em> aussehen wird.</p> <p>Und dass „in alten Browsern soll’s aber soundso“ zusätzlichen Aufwand (also zusätzliche Kosten) verursacht, was bedacht werden will, ob sich das lohnt – oder ob <em>gut</em> (s.o.) nicht gut genug ist.</p> <blockquote> <blockquote> <p>Ich vergleiche jetzt mal, wie die Webseite auf demselben Gerät in verschiedenen Browsern angezeigt wird. —kein Nutzer, jemals</p> </blockquote> <p>Wieso gleiches Gerät? Ich habe ein iPhone, ein iPad, einen Mac. Sähe alles gleich aus.</p> </blockquote> <p>Das glaube ich nicht. Auf dem iPhone (zumindest im Hochformat) werden die Bilder nicht links und rechts vom Text, sondern darüber sein.</p> <blockquote> <p>Dann gehe ich zur Arbeit und setze mich an einen Win10-PC - und sehe eine Webseite, die so fremd aussieht, dass ich erst mal in der Adressleiste nachschauen muss, ob ich auf selfhtml.de oder selhtml.org gelandet bin…</p> </blockquote> <p>Natürlich sollte eine Website übers <em lang="en">corporate design</em> wiedererkannt werden können.</p> <p>Ob Bilder nun über oder links und rechts vom Text angezeigt werden, gehört wohl nicht dazu.</p> <p>Und deshalb ist es auch nicht so schlimm, wenn Bilder in alten Desktop-Browsern ohne Grid-Unterstützung so positioniert werden wie auf Smartphones auch.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 10:31:29 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708248#m1708248 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708248#m1708248 <p>@@Martl</p> <blockquote> <blockquote> <p>...zu vernachlässigende Gruppe</p> </blockquote> <p>woher Du Weisheit diese nehmen?</p> </blockquote> <p>Das war nicht die Weisheit, sondern: „<em><strong>womöglich</strong></em> zu vernachlässigende Gruppe“. Hängt von konkreten Fall ab.</p> <p>Der Punkt ist aber: Es ist ziemlich egal, <em><strong>warum</strong></em> JavaScript nicht ausgeführt wird. Wichtig ist zu beachten, <em><strong>dass</strong></em> JavaScript nicht immer ausgeführt wird – und zwar bei weitaus mehr Nutzern nicht als man denken mag.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 11:59:17 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708249#m1708249 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708249#m1708249 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <blockquote> <blockquote> <p>Der OP wollte wissen, wie man dafür sorgt, dass die Bilder mal neben, mal über dem Text stehen.</p> </blockquote> <p>Die Antwort auf diese Frage ist: nicht überall.</p> </blockquote> <p>Verstehe ich nicht. Was willst du mir damit sagen?</p> </blockquote> <p>Das man mit Stakeholdern am besten von vornherein klärt, dass das Endprodukt überall <em>gut</em>, aber nicht überall <em>gleich</em> aussehen wird.</p> </blockquote> <p>Wie immer in solchen Diskussionen, drückst du dich um die Lösung des eigentlichen Problems. Du sagst: „Es“ geht mit Grid. Wobei „es“ — also das, was der Fragensteller wollte — klar beschrieben ist. Wenn ich sage „es“ geht nicht (in einem ziemlich aktuellen Browser, immerhin Standard-Browser des weltweit meistverbreiteten Betriebssystems), erzählst du was von veralteten Browsern, nicht schlimm usw.</p> <p>Mal abgesehen davon, dass ich dir in vielerlei Hinsicht recht gebe: Die Frage war bereits beantwortet: „mit media-queries“</p> <p>Der Aufwand zur Lösung des konkreten Problems beträgt wie viele Minuten? — Wieso kommst du dann mit Kosten für Stakeholdern und anderen grundsätzlichen Problemen? — Das ist doch hier vollkommen unnötig.</p> <p>Ich brauche 1 Minute oder so für das hier</p> <pre><code class="block language-css"><span class="token selector">figure img</span> <span class="token punctuation">{</span> <span class="token property">width</span><span class="token punctuation">:</span> 100%<span class="token punctuation">;</span> <span class="token property">height</span><span class="token punctuation">:</span> auto<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token selector">figure</span> <span class="token punctuation">{</span> <span class="token property">width</span><span class="token punctuation">:</span> 100%<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token atrule"><span class="token rule">@media</span> screen <span class="token keyword">and</span> <span class="token punctuation">(</span><span class="token property">min-width</span><span class="token punctuation">:</span> 40em<span class="token punctuation">)</span></span> <span class="token punctuation">{</span> <span class="token selector">figure</span> <span class="token punctuation">{</span> <span class="token property">float</span><span class="token punctuation">:</span> left<span class="token punctuation">;</span> <span class="token property">width</span><span class="token punctuation">:</span> whatever<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> </code></pre> <p>Allein Dein Blick in caniuse hat schon mehr als die Hälfte der Entwicklungszeit verschlungen…</p> <p>Und als Ergebnis kommt dann eine Lösung, die keineswegs schneller umsetzbar ist, aber in weniger Browsern das gewünschte Ergebnis erzielt.</p> <p>Marc</p> Problem bei wrapping in flex container Mon, 13 Nov 17 12:03:43 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708250#m1708250 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708250#m1708250 <p>Hallo,</p> <blockquote> <pre><code>width: whatever; </code></pre> </blockquote> <p>ist "whatever" ein gültiger Wert für width? scnr</p> <p>Gruß<br> Kalk</p> Problem bei wrapping in flex container Mon, 13 Nov 17 12:20:44 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708251#m1708251 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708251#m1708251 <p>@@marctrix</p> <blockquote> <p>Die Frage war bereits beantwortet: „mit media-queries“</p> </blockquote> <p>Das ist beantwortet die Frage genausowenig wie „Mach das Garagentor auf“ die Antwort auf die Frage „Wie fahre ich ein Auto?“ ist.</p> <p><em lang="en">Media queries</em> geben an, <em><strong>wann</strong></em> bestimmte Stilangaben wirken. Fehlt nur noch eine Kleinigkeit: <em><strong>was</strong></em> bewirkt werden soll.</p> <p>Innerhalb von <em lang="en">media queries</em> steht die Umsetzung: eben mit Flexbox oder Grid oder der Hack mit Floats.</p> <blockquote> <p>Ich brauche 1 Minute oder so für das hier</p> </blockquote> <p>Ja, das sieht man dem auch an! Du hättest wenigstens noch eine Minute darüber nachdenken sollen, was da noch so alles fehlt:</p> <ul> <li> <p>Die Bilder sollen abwechselnd links und rechts stehen, also <code>float: left</code> bzw. <code>float: right</code></p> </li> <li> <p>Der Text soll <em><strong>neben</strong></em> den Bildern stehen, nicht die Bilder umfließen. (Weshalb Floats hier ein Hack sind.) Der Text braucht also auch <code>float</code> oder <code>margin</code>.</p> </li> <li> <p>Wenn keine unschönen Sachen bei kurzen (oder langen) Texten passieren sollen, muss unbedingt noch ein <code>clear</code> her. (Das kommt davon, wenn man Hacks statt vernünftigen Lösungen verwendet.)</p> </li> </ul> <blockquote> <p>Und als Ergebnis kommt dann eine Lösung, die keineswegs schneller umsetzbar ist</p> </blockquote> <p>Wenn man das mit Floats umsetzen will und alles bedenkt, was dabei zu bedenken ist, dauert das auch länger als eine Minute. Von der Fehleranfälligkeit des Hacks gar nicht zu reden.</p> <p>Wenn man sich in Flexbox und Grid einarbeitet, wird man auch damit schnell. Und kann davon bei zukünftigen Projekten zehren.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Mon, 13 Nov 17 12:34:26 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708253#m1708253 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708253#m1708253 <p>@@marctrix</p> <blockquote> <p>Wie immer in solchen Diskussionen, drückst du dich um die Lösung des eigentlichen Problems.</p> </blockquote> <p>Mitnichten.</p> <blockquote> <p>Du sagst: „Es“ geht mit Grid. Wobei „es“ — also das, was der Fragensteller wollte — klar beschrieben ist. Wenn ich sage „es“ geht nicht (in einem ziemlich aktuellen Browser, immerhin Standard-Browser des weltweit meistverbreiteten Betriebssystems), erzählst du was von veralteten Browsern, nicht schlimm usw.</p> </blockquote> <p>Wie immer in solchen Diskussionen verweise ich auf <em lang="en"><strong>progressive enhancement</strong></em>.</p> <p>Gehört, dass Bilder links/rechts/über dem Text erschienen, zur <em><strong>Grundfunktionalität</strong></em> der Seite? Wohl kaum. Da sind wir uns wohl einig.</p> <p>Layout ist <em lang="en">enhancement</em>. Und je besser der Browser, desto besser kann das Layout aussehen.</p> <p>Und ja, es ist „nicht schlimm“, wenn das Layout in zweitbesseren Browsern nicht bestens aussieht – solange es auch in diesen <em>gut</em> aussieht.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Tue, 14 Nov 17 05:46:17 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708295#m1708295 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708295#m1708295 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Die Frage war bereits beantwortet: „mit media-queries“</p> </blockquote> <p>Das ist beantwortet die Frage genausowenig wie „Mach das Garagentor auf“ die Antwort auf die Frage „Wie fahre ich ein Auto?“ ist.</p> <p><em lang="en">Media queries</em> geben an, <em><strong>wann</strong></em> bestimmte Stilangaben wirken. Fehlt nur noch eine Kleinigkeit: <em><strong>was</strong></em> bewirkt werden soll.</p> </blockquote> <p>Das habe ich anders verstanden. Die Bilder stehen ja bereits rechts und links. Insofern muss das gar nicht erklärt werden.</p> <blockquote> <p>das sieht man dem auch an! Du hättest wenigstens noch eine Minute darüber nachdenken sollen, was da noch so alles fehlt:</p> </blockquote> <p>Nix. Ich weiß ja nicht mal, ob es mit float umgesetzt ist oder nicht. Schien mir hier auch nicht relevant für die Lösung. Siehe oben.</p> <blockquote> <blockquote> <p>Und als Ergebnis kommt dann eine Lösung, die keineswegs schneller umsetzbar ist</p> </blockquote> <p>Wenn man das mit Floats umsetzen will und alles bedenkt, was dabei zu bedenken ist, dauert das auch länger als eine Minute.</p> </blockquote> <p>Ist das nicht vollkommen wurscht, ob wir über eine oder zwei Minuten für ein vollständiges Beispiel reden?</p> <p>Oder etwas zwischen 1,5 und 2,5 Minuten für eine Umsetzung mit einer anderen Technik?</p> <p>Das linke und rechte ausrichten von Bildern ist so trivial, dass hier schlicht dein Argument des Aufwands nicht zählt. Das scheinst du selber auch so zu sehen, denn hier relativierst du diese Aussage ja, indem du den Aufwand für sinnvoll erklärst:</p> <blockquote> <p>Wenn man sich in Flexbox und Grid einarbeitet, wird man auch damit schnell. Und kann davon bei zukünftigen Projekten zehren.</p> </blockquote> <p>Na siehst du. Ein bisschen mehr Aufwand kann nicht schaden und die flexbox-Lösung funktioniert auch in meinem Edge. Damit hätten wir erst gar keine Diskussion gehabt. </p> <p>Marc</p> Problem bei wrapping in flex container Tue, 14 Nov 17 15:11:42 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708388#m1708388 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708388#m1708388 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Wie immer in solchen Diskussionen, drückst du dich um die Lösung des eigentlichen Problems.</p> </blockquote> <p>Mitnichten.</p> <blockquote> <p>Du sagst: „Es“ geht mit Grid. Wobei „es“ — also das, was der Fragensteller wollte — klar beschrieben ist. Wenn ich sage „es“ geht nicht (in einem ziemlich aktuellen Browser, immerhin Standard-Browser des weltweit meistverbreiteten Betriebssystems), erzählst du was von veralteten Browsern, nicht schlimm usw.</p> </blockquote> <p>Wie immer in solchen Diskussionen verweise ich auf <em lang="en"><strong>progressive enhancement</strong></em>.</p> <p>Gehört, dass Bilder links/rechts/über dem Text erschienen, zur <em><strong>Grundfunktionalität</strong></em> der Seite? Wohl kaum. Da sind wir uns wohl einig.</p> </blockquote> <p>Angesichts der Frage: <em>wie kriege ich die Bilder bei schmalen Viewports übereinander und auf breiten Viewports nebeneinander</em>, erscheint mir das jetzt als albern und auch keiner weiteren Diskussion mehr wert…</p> <p>Schreib doch einfach die MS-Schreibweise dazu, dann klappt es auch im IE15. Und ja, das ist ein Mehraufwand. Soll ich dir die zwei Minuten bezahlen? … facepalm</p> <p>Marc</p> Problem bei wrapping in flex container Tue, 14 Nov 17 09:57:06 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708333#m1708333 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708333#m1708333 <p>@@marctrix</p> <blockquote> <blockquote> <p>das sieht man dem auch an! Du hättest wenigstens noch eine Minute darüber nachdenken sollen, was da noch so alles fehlt:</p> </blockquote> <p>Nix. Ich weiß ja nicht mal, ob es mit float umgesetzt ist oder nicht.</p> </blockquote> <p>Es ging hier daraum, dass <em>du</em> das mit Floats umsetzen wolltest (und das innerhalb einer Minute).</p> <blockquote> <p>Ist das nicht vollkommen wurscht, ob wir über eine oder zwei Minuten für ein vollständiges Beispiel reden?</p> </blockquote> <p>Du hattest damit angefangen, mit Floats ginge es schneller als mit Flexbox oder Grid.</p> <blockquote> <p>Das linke und rechte ausrichten von Bildern ist so trivial</p> </blockquote> <p>Warum hast du’s dann nicht richtig gemacht? </p> <blockquote> <p>die flexbox-Lösung funktioniert auch in meinem Edge.</p> </blockquote> <p>Wenn man ein Grid will, ist Flexbox aber (ebenso wie Floats) ein Hack.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Tue, 14 Nov 17 15:02:07 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708387#m1708387 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708387#m1708387 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <blockquote> <p>das sieht man dem auch an! Du hättest wenigstens noch eine Minute darüber nachdenken sollen, was da noch so alles fehlt:</p> </blockquote> <p>Nix. Ich weiß ja nicht mal, ob es mit float umgesetzt ist oder nicht.</p> </blockquote> <p>Es ging hier daraum, dass <em>du</em> das mit Floats umsetzen wolltest (und das innerhalb einer Minute).</p> </blockquote> <p>Nein. Es ging darum, wie man für kleine Bildschirme eine andere Darstellung erreichen kann. Antwort: mit media queries.</p> <p>So jedenfalls habe ich das Anliegen verstanden - aber sagte ich das nicht bereits... </p> <p>Ich klammere mich gar nicht an <code>float</code>. <code>inline-block</code> oder <code>flex-box</code> funktionieren bei mir auch.</p> <blockquote> <blockquote> <p>Ist das nicht vollkommen wurscht, ob wir über eine oder zwei Minuten für ein vollständiges Beispiel reden?</p> </blockquote> <p>Du hattest damit angefangen, mit Floats ginge es schneller als mit Flexbox oder Grid.</p> </blockquote> <p>Ähem:</p> <blockquote> <blockquote> <p>Und dass „in alten Browsern soll’s aber soundso“ <strong>zusätzlichen Aufwand (also zusätzliche Kosten)</strong> verursacht, was bedacht werden will, ob sich das lohnt – oder ob gut (s.o.) nicht gut genug ist. - <em>Gunnar Bittersmann</em></p> </blockquote> </blockquote> <p>Nein. <strong>Du</strong> hast mal wieder auf dem Aufwand herumgeritten, den es bedeutet, alte Browser zu unterstützen. <strong>Daraufhin</strong> habe ich gesagt, dass der Aufwand winzig ist. Ob es nun eine Minute braucht oder zwei ist mir egal.</p> <p>Ich habe geschrieben "sowas" (Beispiel für eine althergebrachte Technik, hier halt mit float) ist schnell runtergeschrieben…</p> <blockquote> <blockquote> <p>Das linke und rechte ausrichten von Bildern ist so trivial</p> </blockquote> <p>Warum hast du’s dann nicht richtig gemacht? </p> </blockquote> <p>Weil <strong>das</strong> bereits in der "problematischen Seite" funktioniert. War ja gar nicht gefragt. Herrgottnochmal. Stell dich doch nicht dümmer, als du bist!</p> <blockquote> <blockquote> <p>die flexbox-Lösung funktioniert auch in meinem Edge.</p> </blockquote> <p>Wenn man ein Grid will, ist Flexbox aber (ebenso wie Floats) ein Hack.</p> </blockquote> <p>Was für eine Weisheit! - Allerdings hast du vergessen zu erwähnen, dass der Hack im Gegensatz zu Deiner coolen Lösung funktioniert. Nicht nur in allen zukünftigen, sondern auch in allen aktuellen Browsern.</p> <p>Die Hacks sind eine pragmatische Lösung. Bald werden sie nicht mehr nötig sein. Ich freue mich drauf.</p> <p>Und all das Gerede von dir ändert nichts daran, dass meine Aussage "Geht bei mir nicht (Win10/Edge 15)" stimmt.</p> <p>Übrigens: wenn <strong>du über Dein</strong> Beispiel länger nachgedacht hättest, würde es den Edge unterstützen. Auch mit CSS Grid kann man zwei Elemente so nebeneinander stellen, dass es im Edge 15 funktioniert…</p> <p>Das mit dem Glashaus und den Steinen, weißt schon </p> <p>Marc</p> <p>PS: Ich bin mir recht sicher, dass du dein Beispiel absichtlich so bereit gestellt hast. Schade, dass du es für ausgeschlossen hältst, dass mein Beispiel so ist, wie es sein sollte. Dann wärest du auch darauf gekommen, wieso ich es so und nicht vollständig geschrieben habe. Nachdem ich es nun aber <strong>zweimal</strong> erklärt habe, dürfte es eindeutig sein?!?</p> Problem bei wrapping in flex container Wed, 15 Nov 17 09:28:56 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708417#m1708417 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708417#m1708417 <p>@@marctrix</p> <blockquote> <p>Ich habe geschrieben "sowas" (Beispiel für eine althergebrachte Technik, hier halt mit float) ist schnell runtergeschrieben…</p> </blockquote> <p><a href="/images/e540a18d-89fd-4f23-8a89-3b0c8b791e69.jpeg" rel="noopener noreferrer"><img src="/images/e540a18d-89fd-4f23-8a89-3b0c8b791e69.jpeg?size=medium" alt="“CSS Grid is way easier than Flexbox. And way way way easier than float-based layouts.” —Jen Simmons" loading="lazy"></a></p> <p>(<a href="https://twitter.com/jensimmons/status/930616751414480896" rel="nofollow noopener noreferrer">Quelle</a>)</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Wed, 15 Nov 17 09:43:29 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708420#m1708420 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708420#m1708420 <p>@@marctrix</p> <blockquote> <p>Ich habe geschrieben "sowas" (Beispiel für eine althergebrachte Technik, hier halt mit float) ist schnell runtergeschrieben…</p> </blockquote> <p>„Sowas“ kann dann so aussehen:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>…<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>…<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>…<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>…<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span><span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span><span class="token punctuation">></span></span>…<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <blockquote> <p>Weil <strong>das</strong> bereits in der "problematischen Seite" funktioniert.</p> </blockquote> <p>… mit</p> <pre><code class="block language-css"><span class="token selector">img, div</span> <span class="token punctuation">{</span> <span class="token property">float</span><span class="token punctuation">:</span> left <span class="token punctuation">}</span> <span class="token selector">img + img, div + div</span> <span class="token punctuation">{</span> <span class="token property">clear</span><span class="token punctuation">:</span> left <span class="token punctuation">}</span> </code></pre> <p>funktioniert das auch – für breite Viewports.</p> <p>Nur dass man nicht mal eben schnell die Bilder bei schmalem Viewport über den Text bekommt. Es soll ja so aussehen:</p> <p>Bild<br> Text<br> Bild<br> Text<br> Bild<br> Text<br> Bild<br> Text<br> Bild<br> Text</p> <p>und nicht so:</p> <p>Bild<br> Text<br> Text<br> Bild<br> Bild<br> Text<br> Text<br> Bild<br> Bild<br> Text</p> <p>Und das geht eben nicht „mit <em lang="en">media queries</em>“.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Tue, 14 Nov 17 19:43:24 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708404#m1708404 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708404#m1708404 <p>@@marctrix</p> <blockquote> <p>Schreib doch einfach die MS-Schreibweise dazu, dann klappt es auch im IE15. Und ja, das ist ein Mehraufwand. Soll ich dir die zwei Minuten bezahlen? … facepalm</p> </blockquote> <p>Nein, die gesamte Zeit. Mit 2 Minuten ist das nicht getan (sonst hätte ich’s ja gemacht).</p> <p>Die Grid-Variante verwendet Features von Grid, die es in der alten, von Edge 15 unterstützten Spec noch nicht gab.</p> <p>LLAP </p> <p>PS: Der Pluspunkt für dich ist mal wieder ein typischer Dem-Bittersmann-haste’s-jetzt-aber-gegeben-Punkt – von jemanden, der nicht der Lage ist oder sich gar nicht erst die Mühe machen wollte zu überschauen, was da fachlich eigentlich dahintersteckt.</p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Wed, 15 Nov 17 07:18:17 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708411#m1708411 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708411#m1708411 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Schreib doch einfach die MS-Schreibweise dazu, dann klappt es auch im IE15. Und ja, das ist ein Mehraufwand. Soll ich dir die zwei Minuten bezahlen? … facepalm</p> </blockquote> <p>Nein, die gesamte Zeit. Mit 2 Minuten ist das nicht getan (sonst hätte ich’s ja gemacht).</p> <p>Die Grid-Variante verwendet Features von Grid, die es in der alten, von Edge 15 unterstützten Spec noch nicht gab.</p> </blockquote> <pre><code class="block language-css"> <span class="token atrule"><span class="token rule">@media</span> screen <span class="token keyword">and</span> <span class="token punctuation">(</span><span class="token property">min-width</span><span class="token punctuation">:</span> 30em<span class="token punctuation">)</span></span> <span class="token punctuation">{</span> <span class="token selector">.wrapper</span> <span class="token punctuation">{</span> <span class="token property">display</span><span class="token punctuation">:</span> -ms-grid<span class="token punctuation">;</span> <span class="token property">display</span><span class="token punctuation">:</span> grid<span class="token punctuation">;</span> <span class="token property">-ms-grid-columns</span><span class="token punctuation">:</span> 1fr 1fr<span class="token punctuation">;</span> <span class="token property">grid-template-columns</span><span class="token punctuation">:</span> 1fr 1fr<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token selector">.box:nth-child(1)</span> <span class="token punctuation">{</span> <span class="token property">-ms-grid-column</span><span class="token punctuation">:</span> 1<span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token selector">.box:nth-child(2)</span> <span class="token punctuation">{</span> <span class="token property">-ms-grid-column</span><span class="token punctuation">:</span> 2<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Hat jetzt tatsächlich 5 Minuten gedauert, allerdings das komplette Beispiel (nicht nur die MS-Unterstützung) von jemandem der mit grid noch recht unerfahren ist. Es mag eleganter gehen (siehe dein Beispiel). Aber immerhin: es funktioniert.</p> <blockquote> <p>PS: Der Pluspunkt für dich ist mal wieder ein typischer Dem-Bittersmann-haste’s-jetzt-aber-gegeben-Punkt – von jemanden, der nicht der Lage ist oder sich gar nicht erst die Mühe machen wollte zu überschauen, was da fachlich eigentlich dahintersteckt.</p> </blockquote> <p>Es geht mir nicht da drum, es dir zu geben. Kann ich auch gar nicht. Du bist in den meisten Punkten fitter als ich. Hier bist du einfach meiner Meinung nach am Thema vorbei geschossen.</p> <p>Irgendwie habe ich das Gefühl, du musst unbedingt überall grid unterbringen. Auch da wo es etwas weit hergeholt ist - <strong>hier ging es ja gar nicht mehr um "wie bekomme ich das nebeneinander", sondern wie bekomme ich das auf schmalen Bildschirmen übereinander</strong>.</p> <p>Die Antwort war: mit media-queries.</p> <p>Dein Lösungsansatz war, das bisher vorhandene komplett zu ignorieren und einen neuen Weg vorzuschlagen. Kann man machen, ist auch eleganter. Macht aber mehr Mühe (die du ja immer als Argument dafür nimmst, etwas zu unterlassen).</p> <p>Und auf einen Hinweis wie "in dem mir zur Verfügung gestellten Browser klappt das (also das, wonach meiner Meinung nach explizit gefragt wurde) aber nicht", reagierst du genauso, als ob man „es dir geben wollte“. Das ist von mir aus nicht so gemeint, auch wenn sich da mitunter ein genervter Unterton einschleichen mag, weil es echt viel Geduld fordert, sich mit dir durch solche Threads zu kämpfen.</p> <p>Wenn du so viel Geduld aufbringen würdest, wie du anderen abverlangst, wartest du einfach noch ein paar Monate ab, dann kann man deinen Weg gehen.</p> <p>Wie viele andere muss ich die letzten beiden Versionen der meisten Browser unterstützen. Sobald der Edge 17 draußen ist, werde ich sofort überall an deine Lösung ein Plus dran setzen.</p> <p>Was dir offenbar vollkommen entgangen ist: ich habe ich ja deine Lösung nicht kritisiert. Nur darauf hingewiesen, dass da die Unterstützung für einen wichtigen Browser fehlt. Und zwar für das, was hier explizit gefragt wurde. <em>Wie kann ich es machen, dass ich zwei unterschiedliche Darstellungen erhalte</em>. Genau diese unterschiedlichen Darstellungen liefert Dein Ansatz im Edge nicht. Dass kannst du jetzt runterspielen, schönreden oder was auch immer. Es ist einfach keine Lösung auf das Problem, vor dem hier jemand steht. So hübsch Dein Ansatz auch ist!</p> <p>Angesichts dieser nicht ganz bis zu Ende gedachten Lösung dann allerdings von anderen komplett fertig umgesetzte Lösungen zu fordern ist — unfair (ist wohl das passendste Wort an dieser Stelle).</p> <p>Übrigens sind IMHO alle Plus-Punkte, die du in diesem Thread bekommen hast von mir…</p> <p>Die <strong>wollte</strong> ich dir geben… </p> <p>Und du hattest schon <a href="https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708216#m1708216" rel="noopener noreferrer">einen Ansatz</a>, den ich für den <strong>heute</strong> besten Ansatz halte.</p> <p>Es mag ein Hack sein, aber schon ein ziemlich eleganter. Und auch den werden wir bald nicht mehr brauchen.</p> <p>Marc</p> Problem bei wrapping in flex container Wed, 15 Nov 17 09:15:48 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708415#m1708415 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708415#m1708415 <p>@@marctrix</p> <blockquote> <blockquote> <p>Die Grid-Variante verwendet Features von Grid, die es in der alten, von Edge 15 unterstützten Spec noch nicht gab.</p> </blockquote> <p>Hat jetzt tatsächlich 5 Minuten gedauert …</p> </blockquote> <p>Ich hätte dazuschreiben müssen, dass ich mich damit auf die <a href="https://codepen.io/gunnarbittersmann/pen/ZaKojX" rel="noopener noreferrer"><em>Ein</em>-Grid-Variante</a> beziehen wollte (zumal die ein einem <a href="https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708223#m1708223" rel="noopener noreferrer">anderen Zweig</a> war).</p> <p>(Alles IIRC; ich will jetzt nicht extra nachschlagen.) Benannte Gridlinien gab’s in der alten Spec nicht. Da hätte man die Nummern nehmen können; dann geht aber der Charme verloren. <code>grid-column-gap</code> gab’s nicht, da hätte man mit noch mehr Gridlinien arbeiten müssen. <code>grid-auto-flow: dense</code> – da steigen die alten Browser wohl ganz aus. Und für die alten Browser müsste man auch die Zeilen vordefinieren; das wird wohl tricky, wenn man deren Anzahl bei variablen Inhalten nicht kennt und die auch jeweils an den Inhalt angepasste Höhe haben sollen.</p> <p>TL;DR: Ich vermute, <em>diese</em> Umsetzung geht nach der alten Spec gar nicht.</p> <p>Die Für-jeden-Block-ein-eigenes-Grid-Variante kriegt man mit der alten Syntax sicher auch für Edge und IE hin.</p> <blockquote> <blockquote> <p>PS: Der Pluspunkt für dich ist mal wieder ein typischer Dem-Bittersmann-haste’s-jetzt-aber-gegeben-Punkt – von jemanden, der nicht der Lage ist oder sich gar nicht erst die Mühe machen wollte zu überschauen, was da fachlich eigentlich dahintersteckt.</p> </blockquote> <p>Es geht mir nicht da drum, es dir zu geben. […] reagierst du genauso, als ob man „es dir geben wollte“.</p> </blockquote> <p>Damit warst doch nicht du gemeint. Du kannst doch nichts dafür, wenn dir jemand anderes einen Punkt gibt.</p> <blockquote> <p>Dein Lösungsansatz war, das bisher vorhandene komplett zu ignorieren und einen neuen Weg vorzuschlagen.</p> </blockquote> <p>Was mit „<a href="https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708216#m1708216" rel="noopener noreferrer">Würgreiz</a>“ hinreichend begründet war. </p> <blockquote> <p>Macht aber mehr Mühe</p> </blockquote> <p>Glaube ich in diesem Fall nicht. In Gammelcode rumzupfuschen dürfte mehr Mühe machen als eine einfache andere Lösung zu implementieren (ob nun Flexbox oder Grid, sei an dieser Stelle mal dahingestellt).</p> <blockquote> <p>Was dir offenbar vollkommen entgangen ist: ich habe ich ja deine Lösung nicht kritisiert. Nur darauf hingewiesen, dass da die Unterstützung für einen wichtigen Browser fehlt.</p> </blockquote> <p>Und ich sage: fehlt nicht. Die Lösung wird auch von Edge <em>unterstützt</em>. Nochmal Jeremy Keith: <em lang="en">“I <strong>support</strong> every browser …but I <strong>optimise</strong> for none.”</em></p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Wed, 15 Nov 17 09:52:32 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708422#m1708422 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708422#m1708422 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Ich habe geschrieben "sowas" (Beispiel für eine althergebrachte Technik, hier halt mit float) ist schnell runtergeschrieben…</p> </blockquote> </blockquote> <p>[Grid ist leichter als Flex und float]</p> <p>Wie immer sind pauschale Aussagen bei konkreten Problemen vollkommen sinnfrei…</p> <p>Wie du schon selbst sagtest, geht bei der Grid-Lösung, die auch im Edge das Problem des OP löst der Charme verloren und es wären vendor-prefixe nötig und alles in allem mindestens so komplex wie die float-Lösung.</p> <p>Das trifft für echte Grids nicht zu — die mit floats umzusetzen ist tatasächlich komplex und mir scheint, das hatte Jen Simmons hier im Kopf. Wenn es aber nur darum geht mal zwei Kästen nebeneinander zu stellen ist ihre von dir zitierte Aussage schlicht falsch.</p> <p>Ich hätte das - wenn ich es entwickelt hätte - vermutlich mit flexbox gemacht.</p> <p>Ohne lang nachzudenken.</p> <p>Mit mehr Nachdenken und der Vorgabe, es möglichst einfach zu machen, hätte ich wohl inline-block genommen. Da hätte ich ohne es ausprobiert zu haben, noch ein oder zwei Zeilen CSS sparen können (für einen Container, aus dem die floats nicht ausbrechen können — vielleicht brauche ich die aber an anderer Stelle, wo Bilder von Text umflossen werden sollen sowieso. Oft hat man ja sowas eh schon im CSS stehen…).</p> <p>Und nach Erscheinen von Edge 17 würde ich es wohl mit grid machen (und zwar mit grid-areas und sprechenden Namen, die ich besonders charmant finde).</p> <p>Auch dein "ich-optimiere-für-keinen-Browser"-Zitat ist in der Regel Unsinn. Denn in der Regel bekommt man Vorgaben. Manchmal kann man beratend auf die Vorgaben Einfluss nehmen, aber wenn der Designer eine hübschere Variante haben will, wird sich meist dafür entschieden. Insofern ist es gar nicht unsere Entscheidung als Entwickler, ob wir den Edge unterstützen und ab welcher Version. Meine Erfahrung aus dem (Arbeits-) Leben.</p> <p>Fun Fact: in der neuen Auflage meines CSS-Buches beschreibe ich für den Einstieg die Umsetzung eines einfachen CSS-Grids mit sprechenden Namen und grid-area - weil das Buch mindestens ein, vielleicht zwei Jahre "halten" muss und schon bei Erscheinen Edge 16 raus ist.</p> <p>Ich habe also gar nichts gegen Deine Lösung. Persönlich kann, darf und will ich aber nicht auf die 2 Spalten im Edge 15 verzichten. Und das ist ein ebenso legitimes Anliegen wie Deines, den elegantesten und bestwartbaren Code zu erstellen. Wie gesagt: bald gibt es keine Argumente mehr, es irgendwie anders zu machen. Außer man lässt Faulheit neues zu lernen als Argument gelten. </p> <p>Zu diesen Leuten gehöre ich allerdings nicht und ich hätte wohl längst den Beruf gewechselt, wenn mir das viele Neu mehr Last als Freude wäre. Ich fände es langweilig Webseiten zu entwickeln, wenn ich immer mit denselben Werkzeugen arbeiten müsste. - Obwohl es selbst damit immer wieder neue kreative Wege zu erlernen gab, um mit den bescheidenen vorhandenen Mitteln so zu <strong>hacken</strong>, dass man auch exotische Designwünsche umsetzen konnte.</p> <p>Marc</p> Problem bei wrapping in flex container Wed, 15 Nov 17 09:56:15 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708423#m1708423 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708423#m1708423 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <p>Nur dass man nicht mal eben schnell die Bilder bei schmalem Viewport über den Text bekommt. Es soll ja so aussehen:</p> </blockquote> <blockquote> <p>Und das geht eben nicht „mit <em lang="en">media queries</em>“.</p> </blockquote> <p>Abwechselnd <code>float: left</code> und <code>float: right</code> verwenden </p> <p>Marc</p> Problem bei wrapping in flex container Wed, 15 Nov 17 13:07:50 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708433#m1708433 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708433#m1708433 <p>@@marctrix</p> <blockquote> <blockquote> <p>Nur dass man nicht mal eben schnell die Bilder bei schmalem Viewport über den Text bekommt. Es soll ja so aussehen:</p> </blockquote> <blockquote> <p>Und das geht eben nicht „mit <em lang="en">media queries</em>“.</p> </blockquote> <p>Abwechselnd <code>float: left</code> und <code>float: right</code> verwenden </p> </blockquote> <p>Ja, darauf wollte ich ja hinaus: Im Markup sollten <code>img</code> und <code>div</code> immer in derselben Reihenfolge stehen.</p> <p>Keine Ahnung, ob das bei der eingangs gezeigten Seite so war. Weißt schon: Würgreflex. </p> <p>Und wenn’s nicht der Fall ist, wird’s eben schwierig, die Ansicht für schmale Viewports man eben schnell nachzurüsten.</p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Wed, 15 Nov 17 13:42:26 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708435#m1708435 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708435#m1708435 <p>Hej Gunnar,</p> <p>[problematische Seite hat mehr Probleme als dem OP bewusst ist]</p> <p>Du hast damit recht. Ich hatte auch verstanden, dass dein Ansatz „alles wegwerfen und richtig machen“ war </p> <p>Es nützt nur recht wenig, deinen Code-Schnipsel in das bestehende Tohuwabohu einzusetzen. Der Hinweis auf die schlechte Ausgangsbasis war ja bereits gegeben.</p> <p>Vielleicht kannst du mit deinen Würgreflexen ja demnächst weniger exhibitionistisch umgehen. Muss ja nicht jeder wissen, was du wann ausscheidest </p> <p>Marc</p> Problem bei wrapping in flex container Wed, 15 Nov 17 14:03:18 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708439#m1708439 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708439#m1708439 <p>@@marctrix</p> <blockquote> <p>Ich hatte auch verstanden, dass dein Ansatz „alles wegwerfen und richtig machen“ war </p> </blockquote> <p>Und das konsequent. Deiner kam mir schwankend vor: mal wolltest du nachrüsten, <a href="https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708423#m1708423" rel="noopener noreferrer">mal von neu erstelltem Markup ausgehen</a>.</p> <blockquote> <p>Vielleicht kannst du mit deinen Würgreflexen ja demnächst weniger exhibitionistisch umgehen. Muss ja nicht jeder wissen, was du wann ausscheidest </p> </blockquote> <p>ICH HAB NICHTS AUSGESCHIEDEN!</p> <p>Den Würgreflex konnte ich ja noch unterdrücken – indem ich mir die Seite nicht näher angesehen habe. </p> <p>LLAP </p> <div class="signature">-- <br> “When UX doesn’t consider <em>all</em> users, shouldn’t it be known as ‘<em>Some</em> User Experience’ or... SUX? #a11y” —<a href="https://twitter.com/thebillygregory/status/552466012713783297" rel="nofollow noopener noreferrer">Billy Gregory</a> </div> Problem bei wrapping in flex container Wed, 15 Nov 17 14:21:32 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708442#m1708442 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708442#m1708442 <p>Hej Gunnar,</p> <blockquote> <p>@@marctrix</p> <blockquote> <p>Ich hatte auch verstanden, dass dein Ansatz „alles wegwerfen und richtig machen“ war </p> </blockquote> <p>Und das konsequent. Deiner kam mir schwankend vor: mal wolltest du nachrüsten, <a href="https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708423#m1708423" rel="noopener noreferrer">mal von neu erstelltem Markup ausgehen</a>.</p> </blockquote> <p>Ich wollte da eigentlich gar nichts ändern. Habe den Quellcode überhaupt nicht angeschaut, da der OP sich ja auch weiter nicht mehr gemeldet hatte.</p> <p>Für mich war die Sache mit "media-queres" eigentlich erledigt… </p> <blockquote> <p>ICH HAB NICHTS AUSGESCHIEDEN!</p> </blockquote> <p>Gut für uns alle, würde ich mal sagen </p> <p>Marc</p> Problem bei wrapping in flex container Wed, 15 Nov 17 16:39:25 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708461#m1708461 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708461#m1708461 <p>Hallo marctrix,</p> <blockquote> <p>Für mich war die Sache mit "media-queres" eigentlich erledigt… </p> </blockquote> <p>zumal ich der Antwort auch das Adjektiv ultrakurz mitgegeben habe und ebenso auf einige Unzulänglichkeiten (aus dem Fiddle) hingewiesen habe.</p> <p>Bis demnächst<br> Matthias</p> <div class="signature">-- <br> Rosen sind rot. </div> Problem bei wrapping in flex container Wed, 15 Nov 17 18:37:13 Z https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708476#m1708476 https://forum.selfhtml.org/self/2017/nov/12/problem-bei-wrapping-in-flex-container/1708476#m1708476 <p>Hej Matthias,</p> <blockquote> <blockquote> <p>Für mich war die Sache mit "media-queres" eigentlich erledigt… </p> </blockquote> <p>zumal ich der Antwort auch das Adjektiv ultrakurz mitgegeben habe und ebenso auf einige Unzulänglichkeiten (aus dem Fiddle) hingewiesen habe.</p> </blockquote> <p>Genau. Damit war für mich alles gesagt. Im Grunde finde ich ja die Bemühungen von @Gunnar Bittersmann löblich, mit vorbildlichem Code dann noch einen drauf zu setzen. Das geht in den Diskussionen, die ich mit ihm habe vielleicht manchmal unter. Denn die vielen plusse von mir, kann er ja nicht zuordnen. Und andere mitlesende auch nicht. Daher sei es mal gesagt: lieber Gunnar, du kriegst von mir viel mehr Sternchen für deinen Einsatz als Kritik.</p> <p>Vielleicht hilft dir das mit meiner vergleichsweise seltenen Kritik in Zukunft souveräner umzugehen?!?</p> <p>Marc</p>