{"id":18899,"date":"2020-07-01T13:01:12","date_gmt":"2020-07-01T20:01:12","guid":{"rendered":"https:\/\/careerkarma.com\/blog\/?p=18899"},"modified":"2020-07-01T13:01:16","modified_gmt":"2020-07-01T20:01:16","slug":"css-tutorial-css-crop-image","status":"publish","type":"post","link":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/","title":{"rendered":"CSS Cropped Images"},"content":{"rendered":"\n

There are several ways to crop an image in CSS; however, the simplest and most effective of these are:<\/p>\n\n\n\n

Using object-fit:<\/h2>\n\n\n\n

When using object-fit: cover<\/code>, we can easily crop the image and still maintain the picture\u2019s aspect ratio.\u00a0
<\/p>\n\n\n\n

You can use object-fit<\/code> along with object-position <\/code>to crop an image in CSS. Try setting the object-fit <\/code>property on an image to none<\/code> and then set object-position: 50% 50%<\/code>. This will center the image in the container. The first number specifies how far from the left to put the image and the second specifies how far from the top to put the image.<\/p>\n\n\n\n

Using background-image:<\/h2>\n\n\n\n

Set the <div><\/code> you want your image to be in to have a background-image: url(<insert url here>)<\/code> property. In addition, set the background-size<\/code> to cover<\/code> to crop it so that the aspect ratio is maintained. The background-position <\/code>is defaulted to top left<\/code>.\u00a0
<\/p>\n\n\n\n

The only problem with using this one is accessibility concerns. Background-images are not necessarily read by screen readers, so if the image used is important to the overall purpose of the site, I would either describe what\u2019s going on in the image on your page or choose another option. 
<\/p>\n\n\n\n

Using width and height, margin and overflow:<\/h2>\n\n\n\n

On the container your <img> is in (probably a <div><\/code> of some sort), set the position to relative and overflow to hidden. The relative position essentially puts a fence around the image so it has definitive boundaries and then the overflow property will hide anything that goes beyond that fence.\u00a0
<\/p>\n\n\n\n

I\u2019ve demonstrated the different ways you can crop your images in the code editor below: <\/p>\n\n\n\n

<!DOCTYPE html>\n<html>\n <head>\n   <title>Parcel Sandbox<\/title>\n   <meta charset="UTF-8" \/>\n   <style>\n     h3 {\n       text-align: center;\n       margin: 20px;\n       padding: 20px;\n       border-top: 1px solid black;\n     }\n     div {\n       display: flex;\n       flex-direction: column;\n       align-items: center;\n       justify-content: center;\n     }\n     div > div {\n       max-width: 500px;\n       width: 100%;\n        align-self: center;\n        position: relative;\n        overflow: hidden;\n     }\n     img {\n       width: 100%;\n     }\n      div.crop-top img {\n       margin: -20% auto 0;\n      }\n      \n      div.crop-bottom img {\n       margin: 0 auto -20%;\n      }\n      \n      div.crop-vertically img {\n        margin: -20% auto -20%;\n      }\n   \n \n     div.crop-right img {\n        width: 120%;\n        margin: 0 -20% 0 0;\n     }\n     div.crop-left img {\n       width: 120%;\n       margin: 0 0 0 -20%;\n     }\n     div.crop-horizontally img {\n       width: 180%;\n        margin: 0 -20% 0;\n        height: 500px;\n     }\n     div.crop-square img {\n        width: 100%;\n     }\n   <\/style>\n <\/head>\n \n <body>\n   <div id="app">\n     <h3>Normal<\/h3>\n     <div>\n       <img\nsrc="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Top Cropped<\/h3>\n     <div class="crop-top">\n       <img src="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Bottom Cropped<\/h3>\n     <div class="crop-bottom">\n       <img\nsrc="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Bottom and Top Cropped<\/h3>\n     <div class="crop-vertically">\n       <img src="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Right Cropped<\/h3>\n     <div class="crop-right">\n       <img src="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Left Cropped<\/h3>\n     <div class="crop-left">\n       <img src="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Left and Right Cropped<\/h3>\n     <div class="crop-horizontally">\n       <img\nsrc="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n     <h3>Square Crop<\/h3>\n     <div class="crop-square">\n       <img\nsrc="https:\/\/images.unsplash.com\/photo-1505649118510-a5d934d3af17?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"\n       \/>\n     <\/div>\n   <\/div>\n <\/body>\n<\/html><\/pre><\/div>\n\n\n\n
Be sure to take a look at the class name attributes in the HTML and then take a look at the matching CSS to get a sense of how the margins are being set to show the part of the picture we want to see. 
<\/p>\n","protected":false},"excerpt":{"rendered":"There are several ways to crop an image in CSS; however, the simplest and most effective of these are: Using object-fit: When using object-fit: cover, we can easily crop the image and still maintain the picture\u2019s aspect ratio.\u00a0 You can use object-fit along with object-position to crop an image in CSS. Try setting the object-fit…","protected":false},"author":77,"featured_media":18902,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[17287],"tags":[],"class_list":{"0":"post-18899","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":"\nCSS Tutorial: CSS Crop Image<\/title>\n<meta name=\"description\" content=\"#Coders use several different ways to #crop images in #CSS. @cmvnk has a breakdown of the top three ways on #CareerKarma\" \/>\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-tutorial-css-crop-image\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Cropped Images\" \/>\n<meta property=\"og:description\" content=\"#Coders use several different ways to #crop images in #CSS. @cmvnk has a breakdown of the top three ways on #CareerKarma\" \/>\n<meta property=\"og:url\" content=\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/\" \/>\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-07-01T20:01:12+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-07-01T20:01:16+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"1202\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Christina Kopecky\" \/>\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=\"Christina Kopecky\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/\"},\"author\":{\"name\":\"Christina Kopecky\",\"@id\":\"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e\"},\"headline\":\"CSS Cropped Images\",\"datePublished\":\"2020-07-01T20:01:12+00:00\",\"dateModified\":\"2020-07-01T20:01:16+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/\"},\"wordCount\":290,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png\",\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/\",\"url\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/\",\"name\":\"CSS Tutorial: CSS Crop Image\",\"isPartOf\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png\",\"datePublished\":\"2020-07-01T20:01:12+00:00\",\"dateModified\":\"2020-07-01T20:01:16+00:00\",\"author\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e\"},\"description\":\"#Coders use several different ways to #crop images in #CSS. @cmvnk has a breakdown of the top three ways on #CareerKarma\",\"breadcrumb\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage\",\"url\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png\",\"contentUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png\",\"width\":1200,\"height\":1202},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#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 Cropped Images\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/careerkarma.com\/blog\/#website\",\"url\":\"https:\/\/careerkarma.com\/blog\/\",\"name\":\"Career Karma\",\"description\":\"Latest Coding Bootcamp News & 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\/ae0cdc4a5d198690d78482646894074e\",\"name\":\"Christina Kopecky\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg\",\"contentUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg\",\"caption\":\"Christina Kopecky\"},\"description\":\"Christina is an experienced technical writer, covering topics as diverse as Java, SQL, Python, and web development. She earned her Master of Music in flute performance from the University of Kansas and a bachelor's degree in music with minors in French and mass communication from Southeast Missouri State. Prior to joining the Career Karma team in June 2020, Christina was a teaching assistant, team lead, and section lead at Lambda School, where she led student groups, performed code and project reviews, and debugged problems for students. Christina's technical content is featured frequently in publications like Codecademy, Repl.it, and Educative.\",\"sameAs\":[\"http:\/\/www.linkedin.com\/in\/cmvnk\"],\"url\":\"https:\/\/careerkarma.com\/blog\/author\/christina-kopecky\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"CSS Tutorial: CSS Crop Image","description":"#Coders use several different ways to #crop images in #CSS. @cmvnk has a breakdown of the top three ways on #CareerKarma","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-tutorial-css-crop-image\/","og_locale":"en_US","og_type":"article","og_title":"CSS Cropped Images","og_description":"#Coders use several different ways to #crop images in #CSS. @cmvnk has a breakdown of the top three ways on #CareerKarma","og_url":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/","og_site_name":"Career Karma","article_publisher":"http:\/\/facebook.com\/careerkarmaapp","article_published_time":"2020-07-01T20:01:12+00:00","article_modified_time":"2020-07-01T20:01:16+00:00","og_image":[{"width":1200,"height":1202,"url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png","type":"image\/png"}],"author":"Christina Kopecky","twitter_card":"summary_large_image","twitter_creator":"@career_karma","twitter_site":"@career_karma","twitter_misc":{"Written by":"Christina Kopecky","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#article","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/"},"author":{"name":"Christina Kopecky","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e"},"headline":"CSS Cropped Images","datePublished":"2020-07-01T20:01:12+00:00","dateModified":"2020-07-01T20:01:16+00:00","mainEntityOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/"},"wordCount":290,"commentCount":0,"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png","articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/","url":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/","name":"CSS Tutorial: CSS Crop Image","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage"},"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png","datePublished":"2020-07-01T20:01:12+00:00","dateModified":"2020-07-01T20:01:16+00:00","author":{"@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e"},"description":"#Coders use several different ways to #crop images in #CSS. @cmvnk has a breakdown of the top three ways on #CareerKarma","breadcrumb":{"@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#primaryimage","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/Screen-Shot-2020-07-02-at-3.58.37-AM.png","width":1200,"height":1202},{"@type":"BreadcrumbList","@id":"https:\/\/careerkarma.com\/blog\/css-tutorial-css-crop-image\/#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 Cropped Images"}]},{"@type":"WebSite","@id":"https:\/\/careerkarma.com\/blog\/#website","url":"https:\/\/careerkarma.com\/blog\/","name":"Career Karma","description":"Latest Coding Bootcamp News & 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\/ae0cdc4a5d198690d78482646894074e","name":"Christina Kopecky","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg","caption":"Christina Kopecky"},"description":"Christina is an experienced technical writer, covering topics as diverse as Java, SQL, Python, and web development. She earned her Master of Music in flute performance from the University of Kansas and a bachelor's degree in music with minors in French and mass communication from Southeast Missouri State. Prior to joining the Career Karma team in June 2020, Christina was a teaching assistant, team lead, and section lead at Lambda School, where she led student groups, performed code and project reviews, and debugged problems for students. Christina's technical content is featured frequently in publications like Codecademy, Repl.it, and Educative.","sameAs":["http:\/\/www.linkedin.com\/in\/cmvnk"],"url":"https:\/\/careerkarma.com\/blog\/author\/christina-kopecky\/"}]}},"_links":{"self":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/18899","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\/77"}],"replies":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/comments?post=18899"}],"version-history":[{"count":0,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/18899\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media\/18902"}],"wp:attachment":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media?parent=18899"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/categories?post=18899"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/tags?post=18899"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}