{"id":2223,"date":"2008-06-24T10:33:28","date_gmt":"2008-06-24T08:33:28","guid":{"rendered":"http:\/\/textundblog.de\/?p=2223"},"modified":"2008-06-24T13:24:16","modified_gmt":"2008-06-24T11:24:16","slug":"interessante-css-technik-faux-absolute-positioning","status":"publish","type":"post","link":"https:\/\/textundblog.de\/?p=2223","title":{"rendered":"Interessante CSS-Technik: Faux Absolute Positioning"},"content":{"rendered":"

\"A<\/a> Das Online Magazin \u00abA List Apart\u00bb ist ja ein steter Quell guter Informationen zum Thema Webdesign. Eric Sol stellt dort nun einen interessanten Versuch vor, im CSS-basierten Weblayout aus den Eigenschaften \u00abCSS: float\u00bb und der absoluten Positionierung von Elementen das Beste heraus zu holen. Er nennt es \u00abFaux Absolute Positioning<\/a>\u00bb:<\/p>\n

There are two popular approaches to positioning with CSS: float and absolute positioning. Both approaches have their pros and cons. My teammates and I have developed a new positioning approach that gives us the best of both worlds. After quite a bit of experimenting and testing, it\u2019s time to share the technique with the rest of the world and see how we can work together to improve it. I\u2019m calling it \u201cfaux absolute positioning\u201d after the faux columns technique that simulates the presence of a column.<\/p><\/blockquote>\n

Was Eric und sein Team bisher in dieser Richtung angedacht haben, sieht sehr interessant aus und lohnt sicher n\u00e4her betrachtet und getestet zu werden, wenn es wieder einmal darum geht, wie man die Inhalte auf einer Website vern\u00fcnftig und browser\u00fcbergreifend korrekt in Reih und Glied zu bringen.<\/p>\n","protected":false},"excerpt":{"rendered":"

Das Online Magazin \u00abA List Apart\u00bb ist ja ein steter Quell guter Informationen zum Thema Webdesign. Eric Sol stellt dort nun einen interessanten Versuch vor, im CSS-basierten Weblayout aus den Eigenschaften \u00abCSS: float\u00bb und der absoluten Positionierung von Elementen das Beste heraus zu holen. Er nennt es \u00abFaux Absolute Positioning\u00bb: There are two popular approaches […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ngg_post_thumbnail":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[4,13],"tags":[],"class_list":["post-2223","post","type-post","status-publish","format-standard","hentry","category-internet","category-webdesign"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p4uzZ-zR","jetpack-related-posts":[{"id":881,"url":"https:\/\/textundblog.de\/?p=881","url_meta":{"origin":2223,"position":0},"title":"CSS-Tutorial in 10 Schritten","author":"Markus","date":"31\/3\/2006","format":false,"excerpt":"Gutes Tutorial zur Positionierung via CSS: \u00abLearn CSS Positioning in Ten Steps\u00bb. Kurz, ersch\u00f6pfend und gut navigierbar. [via F-LOG-GE]","rel":"","context":"In "Webdesign"","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1191,"url":"https:\/\/textundblog.de\/?p=1191","url_meta":{"origin":2223,"position":1},"title":"CSS-Ratschl\u00e4ge f\u00fcr Webgestalter","author":"Markus","date":"12\/9\/2006","format":false,"excerpt":"Communicate, don't decorate. The sooner you learn to communicate with your designs using only what's necessary and relevant, rather than decorate for the mere purpose of decorating, the sooner you'll find your designs touch the consumer's heart, rather than just satisfy the designer's eye. Da is' was dran. Weitere Tipps\u2026","rel":"","context":"In "Webdesign"","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":408,"url":"https:\/\/textundblog.de\/?p=408","url_meta":{"origin":2223,"position":2},"title":"Von Head bis Body auf CSS eingestellt","author":"Markus","date":"22\/6\/2005","format":false,"excerpt":"Sch\u00f6ne Idee von \"Vorsprung durch Webstandards\": Webdesigner erkl\u00e4ren ihre Liebe zu CSS: \"Falling in love with CSS\" Styling with CSS puts the fun back in styling the rather boring elements such as lists, quotes in text, text links etc. And an extra added bonus is the cleaner, lighter and more\u2026","rel":"","context":"In "Webdesign"","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"Falling in love with CSS","src":".\/wp-content\/i-love-css.jpg","width":350,"height":200},"classes":[]},{"id":2016,"url":"https:\/\/textundblog.de\/?p=2016","url_meta":{"origin":2223,"position":3},"title":"Sitepoint-Nachschlagewerk online: CSS Reference","author":"Markus","date":"29\/1\/2008","format":false,"excerpt":"Ein Tipp f\u00fcr alle, die ihre oder fremder Leute Webseiten gestalten und falls es jemand aus diesem Kreis noch nicht mitbekommen hat: Tommy Olsson und Paul O\u2019Brien von Sitepoint haben eine umfangreiche CSS-Referenz aufgebaut und ver\u00f6ffentlicht: CSS Reference. Alle Artikel k\u00f6nnen kommentiert werden. Die einzelnen CSS-Beschreibungen k\u00f6nnen nat\u00fcrlich auch direkt\u2026","rel":"","context":"In "Webdesign"","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"CSS Reference von Sitepoint","src":"https:\/\/i0.wp.com\/textundblog.de\/wp-content\/sitepointcss.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":609,"url":"https:\/\/textundblog.de\/?p=609","url_meta":{"origin":2223,"position":4},"title":"Mehrspaltiger Text mit CSS3","author":"Markus","date":"2\/11\/2005","format":false,"excerpt":"\u00dcber das Problem mehrspaltigen Text auf Webseiten zu platzieren und die L\u00f6sungsans\u00e4tze, die kommende CSS-Spezifikation CSS3 dazu bietet, berichtet der Artikel \u00abIntroducing the CSS3 Multi-Column Module\u00bb von C\u00e9dric Savarese bei A List Apart. While most computer screens are wider than tall, most websites are the exact opposite: longer than wide.\u2026","rel":"","context":"In "Artikel"","block_context":{"text":"Artikel","link":"https:\/\/textundblog.de\/?cat=5"},"img":{"alt_text":"Illustration: Kevin Cornell","src":".\/wp-content\/css3multicolumn.jpg","width":350,"height":200},"classes":[]},{"id":607,"url":"https:\/\/textundblog.de\/?p=607","url_meta":{"origin":2223,"position":5},"title":"Gutes CSS-Teamplay","author":"Markus","date":"1\/11\/2005","format":false,"excerpt":"Webseiten werden mit Cascading Style Sheets (CSS) professionell gestaltet. Hat man l\u00e4nger nicht mehr an den Style Sheets von zur\u00fcckliegenden Projekten gearbeitet, f\u00e4llt es manchmal schwer, sich in den eigenen Stilvorschriften zurecht zu finden. Wie man CSS besser strukturiert, vor allem wenn mehrere im Team an CSS-Dateien zusammenarbeiten, erl\u00e4utert Mike\u2026","rel":"","context":"In "Webdesign"","block_context":{"text":"Webdesign","link":"https:\/\/textundblog.de\/?cat=13"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/posts\/2223","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2223"}],"version-history":[{"count":0,"href":"https:\/\/textundblog.de\/index.php?rest_route=\/wp\/v2\/posts\/2223\/revisions"}],"wp:attachment":[{"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2223"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2223"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/textundblog.de\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2223"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}