{"id":21630,"date":"2020-08-25T17:24:14","date_gmt":"2020-08-26T00:24:14","guid":{"rendered":"https:\/\/careerkarma.com\/blog\/?p=21630"},"modified":"2020-12-29T11:50:45","modified_gmt":"2020-12-29T19:50:45","slug":"css-z-index","status":"publish","type":"post","link":"https:\/\/careerkarma.com\/blog\/css-z-index\/","title":{"rendered":"CSS Z-Index"},"content":{"rendered":"\n<p>When you are designing your layout with CSS, you&#8217;ll often position elements either up\/down or left\/right. The <code>z-index<\/code> allows us to move elements on a 3rd dimension on the Z-axis, with a stacking effect (on top of each other).<\/p>\n\n\n\n<p>The <code>z-index<\/code> property takes either the <code>auto<\/code> keyword or an integer. These are all valid declarations:<br><\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre>z-index: auto;\nz-index: -1;\nz-index: 9999;<\/pre><\/div>\n\n\n\n<p><strong>Note<\/strong>: In order for the z-index to apply, we need to also position elements, using the <code>position<\/code> property either as relative, absolute or fixed. If no position is specified it will be the same as applying <code>z-index: auto<\/code> and no stacking context will be applied.<\/p>\n\n\n\n<p>With that in mind, let&#8217;s take a look at an example.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Let&#8217;s Position Some Guinea Pigs<\/strong><\/h3>\n\n\n\n<p>You can check this example at <a href=\"https:\/\/codepen.io\/fbohz-the-decoder\/pen\/XWdpeWg\" target=\"_blank\" rel=\"noopener\" rel=\"nofollow\">Codepen<\/a>. Play around with it and code with me!<\/p>\n\n\n\n<p>We&#8217;ll be placing two Guinea pigs, or <a href=\"https:\/\/en.wikipedia.org\/wiki\/Cuy\" target=\"_blank\" rel=\"noopener\" rel=\"nofollow\"><em>Cuys<\/em><\/a> (which sounds way cuter). Let&#8217;s imagine we are in summer so it&#8217;s 90+ degrees outside. Cuy#1 will be placed inside a lake, she&#8217;ll have a good time. Cuy#2 is very lazy so we need to give him some coffee to wake him up! So we&#8217;ll stack our Cuy#2 with the coffee so he can drink it.<\/p>\n\n\n\n<p>Without any positioning or CSS our images look more or less like this:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/MfSjPp7Zljo2Yx6UX8uN-GqkEv4HRIhN5TyAl6ZiZwl6l8xFYE7GosTW9-xysu9CPhCAlWHZoHd7AJPOYJQbhnGHA2D0ORMDH--qFmwbFdnkCNH92zlIcFlhY02rtvnYwI8Xgo-T\" alt=\"Screen Shot 2020-08-23 at 6 47 02 PM\"\/><\/figure>\n\n\n\n<p>The idea is to create a stacking context using z-index to then position some images on top of the lake and the coffee.&nbsp;<\/p>\n\n\n\n<p>Also, remember we need to add positioning to our elements in order for z-index to apply. Let&#8217;s go ahead and position our Cuy#1:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre>img.cuy.one {\n  position: absolute;\n}<\/pre><\/div>\n\n\n\n<p>Where the hell is our friend? Let&#8217;s go ahead and add a higher stacking context so it is on top of the lake:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre>img.cuy.one {\n  position: absolute;\n  z-index: 1;\n}<\/pre><\/div>\n\n\n\n<p>Yay! Our cuy is on top of the lake. We now need to add some padding to place it inside the lake, but I&#8217;ll leave you to play with that.<\/p>\n\n\n\n<p>Now that we know how to create a stacking context using <code>z-index<\/code>, we can place our second animal very easy:<\/p>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre>img.cuy.two {\n  position: absolute;\n  width: 160px;\n  padding: 100px;\n  z-index: 1;\n}<\/pre><\/div>\n\n\n\n<p>Again padding will be for exact positioning of the image, and width is used to only specify the size of our little friend. With this, we have finished our task and everyone is happy and feels refreshed:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/2P4RwupRCZKxGAYcp4umAmmZY14o-7C5pArgv9Ui5buq9yKLJ0-F_43BO0rTb70MBwLTTtv6Ho3p88Ccx2tgJ_lowyhp9YI5lFgtpDOEciPQ5uunbxDE9PO7GsHWdX5Yqx7ykWiV\" alt=\"Screen Shot 2020-08-23 at 7 21 58 PM\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Conclusion<\/strong><\/h2>\n\n\n\n<p>Playing around with <code>z-index<\/code> makes way for interesting layout ideas. On the <a href=\"https:\/\/codepen.io\/fbohz-the-decoder\/pen\/XWdpeWg\" target=\"_blank\" rel=\"noopener\" rel=\"nofollow\">Codepen<\/a> I have also provided a second example of a pop chat design positioned and with z-index on top of everything. Check it out!<\/p>\n\n\n\n<p><strong>Do not forget<\/strong> that you must always position elements or your z-index will not work. Try to play around the Codepen by removing the positioning and see it for yourself.&nbsp;<\/p>\n\n\n\n<p>Another recommendation is that you must apply z-index to sibling elements. In our examples our images were not nested and were siblings (side-by-side). <strong>If you have deeply nested elements, z-index might not work as expected<\/strong>. So have that in mind.<\/p>\n","protected":false},"excerpt":{"rendered":"When you are designing your layout with CSS, you'll often position elements either up\/down or left\/right. The z-index allows us to move elements on a 3rd dimension on the Z-axis, with a stacking effect (on top of each other). The z-index property takes either the auto keyword or an integer. These are all valid declarations:&hellip;","protected":false},"author":86,"featured_media":13198,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[17287],"tags":[],"class_list":{"0":"post-21630","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-css"},"acf":{"post_sub_title":"","sprint_id":"","query_class":"CSS","school_sft":"","parent_sft":"","school_privacy_policy":"","has_review":null,"is_sponser_post":"","is_guest_post":""},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>CSS Z-Index: A Step By Step Guide | Career Karma<\/title>\n<meta name=\"description\" content=\"Learn how to position elements on top of each other to create cool layouts using Z-Index. Learn CSS with Career Karma.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/careerkarma.com\/blog\/css-z-index\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Z-Index\" \/>\n<meta property=\"og:description\" content=\"Learn how to position elements on top of each other to create cool layouts using Z-Index. Learn CSS with Career Karma.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/careerkarma.com\/blog\/css-z-index\/\" \/>\n<meta property=\"og:site_name\" content=\"Career Karma\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/facebook.com\/careerkarmaapp\" \/>\n<meta property=\"article:published_time\" content=\"2020-08-26T00:24:14+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-12-29T19:50:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/03\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1020\" \/>\n\t<meta property=\"og:image:height\" content=\"662\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Felipe Boh\u00f3rquez\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@career_karma\" \/>\n<meta name=\"twitter:site\" content=\"@career_karma\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Felipe Boh\u00f3rquez\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/\"},\"author\":{\"name\":\"Felipe Boh\u00f3rquez\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#\\\/schema\\\/person\\\/e2cbf72dcbfaf9e81a8b6a38c1bd4220\"},\"headline\":\"CSS Z-Index\",\"datePublished\":\"2020-08-26T00:24:14+00:00\",\"dateModified\":\"2020-12-29T19:50:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/\"},\"wordCount\":479,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg\",\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/\",\"name\":\"CSS Z-Index: A Step By Step Guide | Career Karma\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg\",\"datePublished\":\"2020-08-26T00:24:14+00:00\",\"dateModified\":\"2020-12-29T19:50:45+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#\\\/schema\\\/person\\\/e2cbf72dcbfaf9e81a8b6a38c1bd4220\"},\"description\":\"Learn how to position elements on top of each other to create cool layouts using Z-Index. Learn CSS with Career Karma.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#primaryimage\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg\",\"contentUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/03\\\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg\",\"width\":1020,\"height\":662,\"caption\":\"Python Dictionary Get\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-z-index\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS\",\"item\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"CSS Z-Index\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/\",\"name\":\"Career Karma\",\"description\":\"Latest Coding Bootcamp News &amp; Career Hacks from Industry Insiders\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#\\\/schema\\\/person\\\/e2cbf72dcbfaf9e81a8b6a38c1bd4220\",\"name\":\"Felipe Boh\u00f3rquez\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/08\\\/Screen-Shot-2020-08-17-at-11.10.42-AM-150x150.png\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/08\\\/Screen-Shot-2020-08-17-at-11.10.42-AM-150x150.png\",\"contentUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/08\\\/Screen-Shot-2020-08-17-at-11.10.42-AM-150x150.png\",\"caption\":\"Felipe Boh\u00f3rquez\"},\"description\":\"Felipe Boh\u00f3rquez is a Software Engineer and technical writer at Career Karma. He covers all things frontend and backend development.\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/author\\\/felipe-bohorquez\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"CSS Z-Index: A Step By Step Guide | Career Karma","description":"Learn how to position elements on top of each other to create cool layouts using Z-Index. Learn CSS with Career Karma.","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:\/\/careerkarma.com\/blog\/css-z-index\/","og_locale":"en_US","og_type":"article","og_title":"CSS Z-Index","og_description":"Learn how to position elements on top of each other to create cool layouts using Z-Index. Learn CSS with Career Karma.","og_url":"https:\/\/careerkarma.com\/blog\/css-z-index\/","og_site_name":"Career Karma","article_publisher":"http:\/\/facebook.com\/careerkarmaapp","article_published_time":"2020-08-26T00:24:14+00:00","article_modified_time":"2020-12-29T19:50:45+00:00","og_image":[{"width":1020,"height":662,"url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/03\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg","type":"image\/jpeg"}],"author":"Felipe Boh\u00f3rquez","twitter_card":"summary_large_image","twitter_creator":"@career_karma","twitter_site":"@career_karma","twitter_misc":{"Written by":"Felipe Boh\u00f3rquez","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#article","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/"},"author":{"name":"Felipe Boh\u00f3rquez","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/e2cbf72dcbfaf9e81a8b6a38c1bd4220"},"headline":"CSS Z-Index","datePublished":"2020-08-26T00:24:14+00:00","dateModified":"2020-12-29T19:50:45+00:00","mainEntityOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/"},"wordCount":479,"commentCount":0,"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/03\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg","articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/careerkarma.com\/blog\/css-z-index\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/","url":"https:\/\/careerkarma.com\/blog\/css-z-index\/","name":"CSS Z-Index: A Step By Step Guide | Career Karma","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#primaryimage"},"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/03\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg","datePublished":"2020-08-26T00:24:14+00:00","dateModified":"2020-12-29T19:50:45+00:00","author":{"@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/e2cbf72dcbfaf9e81a8b6a38c1bd4220"},"description":"Learn how to position elements on top of each other to create cool layouts using Z-Index. Learn CSS with Career Karma.","breadcrumb":{"@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/careerkarma.com\/blog\/css-z-index\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#primaryimage","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/03\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/03\/photography-of-laptop-computer-camera-smartphone-headphones-705164.jpg","width":1020,"height":662,"caption":"Python Dictionary Get"},{"@type":"BreadcrumbList","@id":"https:\/\/careerkarma.com\/blog\/css-z-index\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/careerkarma.com\/blog\/"},{"@type":"ListItem","position":2,"name":"CSS","item":"https:\/\/careerkarma.com\/blog\/css\/"},{"@type":"ListItem","position":3,"name":"CSS Z-Index"}]},{"@type":"WebSite","@id":"https:\/\/careerkarma.com\/blog\/#website","url":"https:\/\/careerkarma.com\/blog\/","name":"Career Karma","description":"Latest Coding Bootcamp News &amp; Career Hacks from Industry Insiders","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/careerkarma.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/e2cbf72dcbfaf9e81a8b6a38c1bd4220","name":"Felipe Boh\u00f3rquez","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/08\/Screen-Shot-2020-08-17-at-11.10.42-AM-150x150.png","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/08\/Screen-Shot-2020-08-17-at-11.10.42-AM-150x150.png","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/08\/Screen-Shot-2020-08-17-at-11.10.42-AM-150x150.png","caption":"Felipe Boh\u00f3rquez"},"description":"Felipe Boh\u00f3rquez is a Software Engineer and technical writer at Career Karma. He covers all things frontend and backend development.","url":"https:\/\/careerkarma.com\/blog\/author\/felipe-bohorquez\/"}]}},"_links":{"self":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/21630","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/users\/86"}],"replies":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/comments?post=21630"}],"version-history":[{"count":0,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/21630\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media\/13198"}],"wp:attachment":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media?parent=21630"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/categories?post=21630"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/tags?post=21630"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}