{"id":21004,"date":"2023-02-10T04:01:35","date_gmt":"2023-02-10T04:01:35","guid":{"rendered":"https:\/\/www.booksofall.com\/de\/?post_type=product&#038;p=21004"},"modified":"2023-02-10T04:01:36","modified_gmt":"2023-02-10T04:01:36","slug":"understanding-flexbox-everything-you-need-to-know","status":"publish","type":"product","link":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/","title":{"rendered":"Understanding Flexbox: Everything you need to know"},"content":{"rendered":"<h5>Introduction<\/h5>\n<p>Learning <a href=\"https:\/\/css-tricks.com\/snippets\/css\/a-guide-to-flexbox\/\">Flexbox<\/a> can be a pain in the butt. For most persons, it\u2019s not particularly fun at first. It challenges you to rethink how you\u2019ve dealt with layouts in css.<\/p>\n<p>Don\u2019t fret. I will really walk you through all you need to know. That\u2019s the aim of this book.<\/p>\n<h5>Why Use Flexbox?<\/h5>\n<p><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Learn\/CSS\/First_steps\/What_is_CSS\">CSS<\/a> has evolved a lot over the past few years. Designers loved the introduction of filters, transitions, and transforms. But something was missing. Something we all craved.<\/p>\n<p><a href=\"https:\/\/www.cedefop.europa.eu\/en\/blog-articles\/crafting-skills-intelligence\">Crafting Intelligent<\/a> page layouts with CSS seemed to have persisted for too long, and this got many of us writing hacky CSS.<\/p>\n<p>We always had to deal with floats, table display hacks, and the consequences they brought. If you\u2019ve written CSS for sometime, you can probably relate to this. And if not, welcome to a better world!<\/p>\n<p>It seems like our prayers as designers and front-end developers have finally been heard. This time, in grand style.<\/p>\n<p>Now we can all ditch those hacky CSS tricks. No more incessant use of floats, table-cell displays.<\/p>\n<p>It\u2019s time to embrace a cleaner <a href=\"https:\/\/www.cambridge.org\/core\/books\/modern-syntax\/D734ADDA1A0A9856CE6CA05E25DAD064\">modern syntax<\/a> for crafting intelligent layouts. Welcome the <a href=\"https:\/\/www.w3schools.com\/css\/css3_flexbox.asp\">CSS Flexbox model<\/a>.<\/p>\n<h5>What Is Flexbox?<\/h5>\n<p>According to the specification, the Flexbox model provides for an efficient way to layout, align, and distribute space among elements within your document &#8211; even when the viewport and the size of your elements is unknown and\/or dynamic.<\/p>\n<p>If that sound too formal, I understand the feeling. In just a bit, I\u2019ll explain what that means in \u201cEnglish\u201d.<\/p>\n<p>Whether you write CSS in your dreams or you\u2019re just getting started, you\u2019ll feel right at home.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p><iframe frameborder=\"0\" allowtransparency=\"true\" allowFullscreen=\"true\" style=\"width: 100%; height: 700px; border: none;\" src=\"https:\/\/online.visual-paradigm.com\/share\/book\/understanding-flexbox-193xo4beve?enforceShowPromotionBar=true&#038;p=1\"><\/iframe><\/p>\n","protected":false},"featured_media":21008,"template":"","meta":{"_yoast_wpseo_title":"","_yoast_wpseo_metadesc":""},"product_brand":[],"product_cat":[325],"product_tag":[],"class_list":{"0":"post-21004","1":"product","2":"type-product","3":"status-publish","4":"has-post-thumbnail","6":"product_cat-html-and-css","8":"first","9":"instock","10":"shipping-taxable","11":"product-type-simple"},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.1.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Understanding Flexbox: Everything you need to know - BooksOfAll German<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Understanding Flexbox: Everything you need to know - BooksOfAll German\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/\" \/>\n<meta property=\"og:site_name\" content=\"BooksOfAll German\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-10T04:01:36+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"1\u00a0Minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/\",\"url\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/\",\"name\":\"Understanding Flexbox: Everything you need to know - BooksOfAll German\",\"isPartOf\":{\"@id\":\"https:\/\/www.booksofall.com\/de\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png\",\"datePublished\":\"2023-02-10T04:01:35+00:00\",\"dateModified\":\"2023-02-10T04:01:36+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#primaryimage\",\"url\":\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png\",\"contentUrl\":\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png\",\"width\":\"521\",\"height\":\"740\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.booksofall.com\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Categories\",\"item\":\"https:\/\/www.booksofall.com\/de\/categories\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Understanding Flexbox: Everything you need to know\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.booksofall.com\/de\/#website\",\"url\":\"https:\/\/www.booksofall.com\/de\/\",\"name\":\"BooksOfAll German\",\"description\":\"Biggest IT eBooks library and learning resources - Free eBooks for programming, computing, artificial intelligence and more.\",\"publisher\":{\"@id\":\"https:\/\/www.booksofall.com\/de\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.booksofall.com\/de\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.booksofall.com\/de\/#organization\",\"name\":\"BooksOfAll German\",\"url\":\"https:\/\/www.booksofall.com\/de\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/www.booksofall.com\/de\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2022\/06\/booksofall-logo-2.png\",\"contentUrl\":\"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2022\/06\/booksofall-logo-2.png\",\"width\":166,\"height\":30,\"caption\":\"BooksOfAll German\"},\"image\":{\"@id\":\"https:\/\/www.booksofall.com\/de\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Understanding Flexbox: Everything you need to know - BooksOfAll German","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/","og_locale":"de_DE","og_type":"article","og_title":"Understanding Flexbox: Everything you need to know - BooksOfAll German","og_url":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/","og_site_name":"BooksOfAll German","article_modified_time":"2023-02-10T04:01:36+00:00","og_image":[{"url":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_image":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"1\u00a0Minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/","url":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/","name":"Understanding Flexbox: Everything you need to know - BooksOfAll German","isPartOf":{"@id":"https:\/\/www.booksofall.com\/de\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#primaryimage"},"image":{"@id":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#primaryimage"},"thumbnailUrl":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png","datePublished":"2023-02-10T04:01:35+00:00","dateModified":"2023-02-10T04:01:36+00:00","breadcrumb":{"@id":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#primaryimage","url":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png","contentUrl":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2023\/02\/img_63e5bf34c78f3.png","width":"521","height":"740"},{"@type":"BreadcrumbList","@id":"https:\/\/www.booksofall.com\/de\/understanding-flexbox-everything-you-need-to-know\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.booksofall.com\/de\/"},{"@type":"ListItem","position":2,"name":"Categories","item":"https:\/\/www.booksofall.com\/de\/categories\/"},{"@type":"ListItem","position":3,"name":"Understanding Flexbox: Everything you need to know"}]},{"@type":"WebSite","@id":"https:\/\/www.booksofall.com\/de\/#website","url":"https:\/\/www.booksofall.com\/de\/","name":"BooksOfAll German","description":"Biggest IT eBooks library and learning resources - Free eBooks for programming, computing, artificial intelligence and more.","publisher":{"@id":"https:\/\/www.booksofall.com\/de\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.booksofall.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/www.booksofall.com\/de\/#organization","name":"BooksOfAll German","url":"https:\/\/www.booksofall.com\/de\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.booksofall.com\/de\/#\/schema\/logo\/image\/","url":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2022\/06\/booksofall-logo-2.png","contentUrl":"https:\/\/www.booksofall.com\/de\/wp-content\/uploads\/sites\/9\/2022\/06\/booksofall-logo-2.png","width":166,"height":30,"caption":"BooksOfAll German"},"image":{"@id":"https:\/\/www.booksofall.com\/de\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/product\/21004","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/product"}],"about":[{"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/types\/product"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/media\/21008"}],"wp:attachment":[{"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/media?parent=21004"}],"wp:term":[{"taxonomy":"product_brand","embeddable":true,"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/product_brand?post=21004"},{"taxonomy":"product_cat","embeddable":true,"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/product_cat?post=21004"},{"taxonomy":"product_tag","embeddable":true,"href":"https:\/\/www.booksofall.com\/de\/wp-json\/wp\/v2\/product_tag?post=21004"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}