{"id":451,"date":"2013-09-28T16:14:14","date_gmt":"2013-09-28T14:14:14","guid":{"rendered":"http:\/\/paulchr.ablass.me\/blog\/?p=451"},"modified":"2013-10-29T21:35:42","modified_gmt":"2013-10-29T20:35:42","slug":"os-x-10-8-4-firefox-24-und-die-scrollbars-in-der-responsive-design-view","status":"publish","type":"post","link":"https:\/\/paulchr.ablass.me\/blog\/2013\/09\/28\/os-x-10-8-4-firefox-24-und-die-scrollbars-in-der-responsive-design-view\/","title":{"rendered":"OS X 10.8.4, Firefox 24 und die Scrollbars in der Responsive Design View"},"content":{"rendered":"<p><a href=\"http:\/\/paulchr.ablass.me\/blog\/2013\/09\/28\/os-x-10-8-4-firefox-24-und-die-scrollbars-in-der-responsive-design-view\/firefox-scrollbars\/\" rel=\"attachment wp-att-453\"><img decoding=\"async\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/firefox-scrollbars.png?resize=193%2C300\" alt=\"Scrollbars in der Responsive Design View liegen \u00fcber dem Seiteninhalt\" width=\"193\" height=\"300\" class=\"alignleft size-medium wp-image-453\" srcset=\"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/firefox-scrollbars.png?resize=193%2C300&amp;ssl=1 193w, https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/firefox-scrollbars.png?w=351&amp;ssl=1 351w\" sizes=\"(max-width: 193px) 100vw, 193px\" data-recalc-dims=\"1\" \/><\/a>Als ich am vergangenen Dienstag den frisch auf Version 24 aktualisierten Firefox benutze und mich daran machte, mein aktuelles Projekt in der <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Tools\/Responsive_Design_View\">Responsive Design View<\/a> zu bearbeiten, wunderte ich mich etwas: Zuvor nebeneinander flie\u00dfende Elemente brachen mit einem Mal um. Beim Blick in das Layout-Fenster vom Firebug fiel mir auf, dass die Seitenbreite quasi \u00fcber Nacht von 320 auf 305 Pixel gesunken war. Wie konnte das passieren? Nach ein wenig Gr\u00fcbeln (und einer Tasse Kaffee) kam ich schlie\u00dflich drauf: Die Scrollbars lagen nicht mehr \u00fcber dem Inhalt, sondern daneben und beeintr\u00e4chtigten somit dessen Breite. \u00c4u\u00dferst unsch\u00f6n, denn dieses Verhalten stimmt nicht mit mobilen Endger\u00e4ten \u00fcberein in denen Scrollbars \u00fcber dem Inhalt liegen (mittlerweile ist dieser <a href=\"https:\/\/bugzilla.mozilla.org\/show_bug.cgi?id=918996\">Bug dokumentiert<\/a> und soll in Firefox-Version 27 behoben werden).<\/p>\n<p>Ein tempor\u00e4rer Fix f\u00fcr dieses Problem bestand im Addieren von je 15 Pixel zu den entsprechenden Preset-Breiten der Responsive Design View. Etwas umst\u00e4ndlicher zwar, aber es funktionierte. <\/p>\n<p>Als ich dieses Problemchen jedoch kurz darauf mit meinen Frontend-Developer-Kollegen besprach, kam eine weitere L\u00f6sungsm\u00f6glichkeit zu Tage: Und zwar gibt es in den <strong>Systemeinstellungen<\/strong> unter <strong>Allgemein<\/strong> spezielle Settings f\u00fcr <em>Rollbalken<\/em>. Dort muss die Option <strong>Beim Scrollen<\/strong> aktiviert sein. Dies bewirkt, dass systemweit Scrollbars nur beim tats\u00e4chlichen Scrollen eingeblendet werden und dann \u00fcber dem Fensterinhalt liegen- auch in der Reponsive Design View im Firefox 24.<br \/>\n<a href=\"http:\/\/paulchr.ablass.me\/blog\/2013\/09\/28\/os-x-10-8-4-firefox-24-und-die-scrollbars-in-der-responsive-design-view\/macosx-scrollbar-settings\/\" rel=\"attachment wp-att-452\"><img decoding=\"async\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/macosx-scrollbar-settings.png?resize=668%2C534\" alt=\"Scroll-Einstellungen von OS X 10.8.4\" width=\"668\" height=\"534\" class=\"aligncenter size-full wp-image-452\" srcset=\"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/macosx-scrollbar-settings.png?w=668&amp;ssl=1 668w, https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/macosx-scrollbar-settings.png?resize=300%2C239&amp;ssl=1 300w\" sizes=\"(max-width: 668px) 100vw, 668px\" data-recalc-dims=\"1\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Als ich am vergangenen Dienstag den frisch auf Version 24 aktualisierten Firefox benutze und mich daran machte, mein aktuelles Projekt in der Responsive Design View zu bearbeiten, wunderte ich mich etwas: Zuvor nebeneinander flie\u00dfende Elemente brachen mit einem Mal um. Beim Blick in das Layout-Fenster vom Firebug fiel mir auf, dass die Seitenbreite quasi \u00fcber [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":452,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_newsletter_tier_id":0,"jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false}}},"categories":[81],"tags":[115,130,129,131],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/i0.wp.com\/paulchr.ablass.me\/blog\/wp-content\/uploads\/2013\/09\/macosx-scrollbar-settings.png?fit=668%2C534&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/p2Vohc-7h","jetpack-related-posts":[{"id":357,"url":"https:\/\/paulchr.ablass.me\/blog\/2013\/08\/26\/aggressives-firefox-schriftcaching-mit-versionsnummern-austricksen\/","url_meta":{"origin":451,"position":0},"title":"Aggressives Firefox-Schriftcaching mit Versionsnummern austricksen","author":"Paul-Christian Abla\u00df","date":"26. August 2013","format":false,"excerpt":"S\u00e4mtliche Firefox-Versionen, die ich unter Ubuntu, Windows 7 und Mac OS X benutze, speichern einmal geladene Webfonts sehr aggressiv. Aggressiv bedeutet in diesem Fall, dass ein normales L\u00f6schen des Caches zum Neu-Laden der Schrift nicht ausreicht, stattdessen muss zus\u00e4tzlich noch der Browser neu gestartet werden. Da dies im Entwicklungsprozess doch\u2026","rel":"","context":"In &quot;Browser&quot;","block_context":{"text":"Browser","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/browser\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":132,"url":"https:\/\/paulchr.ablass.me\/blog\/2013\/02\/24\/responsive-iframe-und-video-elemente\/","url_meta":{"origin":451,"position":1},"title":"Responsive iframe- und video-Elemente","author":"Paul-Christian Abla\u00df","date":"24. Februar 2013","format":false,"excerpt":"Beim Einbetten von Videos innerhalb von iframe- oder video-Elementen in responsiven Websites gibt es in der Regel Probleme bei einer Gr\u00f6\u00dfenver\u00e4nderung ihres Containerelements. Obwohl die Breite des iframe's mittels der Css-Eigenschaft max-width auf 100% gesetzt werden kann, ist davon nicht dessen H\u00f6he betroffen. Um dieses Problem zu beheben, gibt es\u2026","rel":"","context":"In &quot;Css&quot;","block_context":{"text":"Css","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/css\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":584,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/03\/20\/lesetipp-ein-zwischenstand-zu-responsive-images\/","url_meta":{"origin":451,"position":2},"title":"Lesetipp: Ein Zwischenstand zu responsive images","author":"Paul-Christian Abla\u00df","date":"20. M\u00e4rz 2014","format":false,"excerpt":"A Q&A on the Picture Element ist ein guter Ausgangspunkt, um sich auf den aktuellen Stand der Entwicklung bei responsives images zu bringen. Zum einen wird ein kurzer Abriss des bisherigen Entwicklungsprozesses gegeben und zum anderen bietet der Artikel genug Links und Schlagworte f\u00fcr eine vertiefende Recherche. Die momentan\u2122 angestrebte\u2026","rel":"","context":"In &quot;Css&quot;","block_context":{"text":"Css","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/css\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":775,"url":"https:\/\/paulchr.ablass.me\/blog\/2015\/10\/13\/mac-os-x-autovervollstaendigung-in-der-bash\/","url_meta":{"origin":451,"position":3},"title":"Mac OS X: Autovervollst\u00e4ndigung in der Bash","author":"Paul-Christian Abla\u00df","date":"13. Oktober 2015","format":false,"excerpt":"Um das automatische Vervollst\u00e4ndigen von Befehlen in der Bash f\u00fcr Programme wie Git zu erm\u00f6glichen, empfiehlt sich die Installation Brew-Pakets bash-completion. $ brew install bash-completion Nach der Installation m\u00fcssen die folgenden Zeilen in die .bash_profile-Datei eingetragen werden: if [ -f $(brew --prefix)\/etc\/bash_completion ]; then . $(brew --prefix)\/etc\/bash_completion fi Um das\u2026","rel":"","context":"In &quot;Bash&quot;","block_context":{"text":"Bash","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/bash\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":749,"url":"https:\/\/paulchr.ablass.me\/blog\/2014\/12\/19\/mac-os-x-die-bash-vom-terminal-aus-neu-starten\/","url_meta":{"origin":451,"position":4},"title":"Mac OS X: Die Bash vom Terminal aus neu starten","author":"Paul-Christian Abla\u00df","date":"19. Dezember 2014","format":false,"excerpt":"Um ohne System-Neustart\/ Ab- und anschlie\u00dfender Anmeldung \u00c4nderungen an der Shell-Konfiguration vorzunehmen, kann das Shell-BuiltIn source genutzt werden. Was bewirkt source? source f\u00fchrt die als Argument angeh\u00e4ngte Datei in der selben Bash-Umgebung aus. In Verwendung mit den Konfigurationsdateien .bash_profile oder .bashrc erfolgt also ein Neu-Einlesen der Bash-Konfiguration im gleichen Prozess.\u2026","rel":"","context":"In &quot;Bash&quot;","block_context":{"text":"Bash","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/bash\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":772,"url":"https:\/\/paulchr.ablass.me\/blog\/2015\/10\/11\/homebrew-unter-mac-os-x-10-11-el-capitan-nutzen\/","url_meta":{"origin":451,"position":5},"title":"Homebrew unter Mac OS X 10.11 El Capitan nutzen","author":"Paul-Christian Abla\u00df","date":"11. Oktober 2015","format":false,"excerpt":"Mit dem Upgrade auf El Capitan f\u00fchrt Apple ein SIP genanntes Sicherheitsfeature ein. Dieses ver\u00e4ndert die Zugriffsrechte des Ordners \/usr\/local\/ und verhindert die Nutzung von Homebrew. Der von $ brew doctor angezeigte Warnhinweis sieht folgenderma\u00dfen aus: Warning: The \/usr\/local directory is not writable. Even if this directory was writable when\u2026","rel":"","context":"In &quot;Tools&quot;","block_context":{"text":"Tools","link":"https:\/\/paulchr.ablass.me\/blog\/themen\/tools\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/451"}],"collection":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/comments?post=451"}],"version-history":[{"count":9,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/451\/revisions"}],"predecessor-version":[{"id":478,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/posts\/451\/revisions\/478"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/media\/452"}],"wp:attachment":[{"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/media?parent=451"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/categories?post=451"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/paulchr.ablass.me\/blog\/wp-json\/wp\/v2\/tags?post=451"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}