{"id":18783,"date":"2020-07-01T10:29:49","date_gmt":"2020-07-01T17:29:49","guid":{"rendered":"https:\/\/careerkarma.com\/blog\/?p=18783"},"modified":"2020-12-29T11:47:38","modified_gmt":"2020-12-29T19:47:38","slug":"css-sticky-footer","status":"publish","type":"post","link":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/","title":{"rendered":"CSS Sticky Footer"},"content":{"rendered":"\n<p>Sticky footers are not to be confused with fixed footers \u2013 a sticky footer is a pattern where the footer always sticks either to the bottom of the screen (in cases where content does not fill up the page) or sticks to the bottom of the webpage content. A fixed footer simply stays at the bottom of the screen as the user scrolls the page. These code editor examples distinguish the difference:<br><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Fixed Footer:<\/h2>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre>&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n   &lt;head&gt;\n       &lt;meta charset=&quot;UTF-8&quot; \/&gt;\n       &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot; \/&gt;\n       &lt;title&gt;Sticky Footer&lt;\/title&gt;\n   &lt;\/head&gt;\n   &lt;style&gt;\n       body {\n           width: 100%;\n           margin: 0 auto;\n           text-align: center;\n       }\n       header {\n           background: orange;\n           height: 100px;\n           display: inline-block;\n           width: 100%;\n       }\n       p {\n           text-align: left;\n           width: 80%;\n           margin: 0 auto;\n           line-height: 5rem;\n           font-size: 2rem;\n           text-indent: 5rem;\n       }\n       footer {\n           background: black;\n           color: white;\n           position: fixed;\n           bottom: 0;\n           width: 100%;\n       }\n   &lt;\/style&gt;\n   &lt;body&gt;\n       &lt;header&gt;\n           &lt;h1&gt;This is a header&lt;\/h1&gt;\n       &lt;\/header&gt;\n       &lt;div&gt;\n           &lt;h2&gt;This is the website content.&lt;\/h2&gt;\n           &lt;p&gt;\n               Lorem ipsum dolor, sit amet consectetur adipisicing elit.\n               Aspernatur cum aliquid nostrum dolore sunt ex exercitationem,\n               enim provident quia laudantium, blanditiis repellendus similique\n               in possimus, nisi voluptatem? Quibusdam, suscipit impedit.\n           &lt;\/p&gt;\n           &lt;p&gt;\n               Lorem ipsum dolor sit amet consectetur adipisicing elit. Facilis\n               veritatis doloremque recusandae similique mollitia quod impedit,\n               rerum inventore beatae quia vel aperiam maiores corrupti tenetur\n               illo praesentium repudiandae a distinctio?\n           &lt;\/p&gt;\n           &lt;p&gt;\n               Lorem ipsum dolor sit amet consectetur, adipisicing elit. Dicta\n               saepe, reiciendis in maxime perspiciatis cum similique a quis\n               accusamus blanditiis harum voluptates at doloribus autem numquam\n               sint? Qui, tempora ratione!\n           &lt;\/p&gt;\n           &lt;p&gt;\n               Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde,\n               deserunt placeat? Laborum voluptates minus, adipisci odit\n               repellat corrupti libero! Asperiores delectus quasi debitis\n               mollitia eum et vel recusandae quas esse.\n           &lt;\/p&gt;\n           &lt;p&gt;\n               Lorem ipsum dolor sit amet consectetur adipisicing elit.\n               Molestias ad dolorem rerum suscipit eos eius libero animi omnis,\n               ea esse distinctio doloremque corporis, a quidem inventore sequi\n               nostrum aut impedit.\n           &lt;\/p&gt;\n           &lt;p&gt;\n               Lorem ipsum dolor sit, amet consectetur adipisicing elit.\n               Suscipit quod ipsum maiores, minus non atque asperiores corrupti\n               placeat nulla temporibus est libero numquam ad culpa architecto\n               reprehenderit nemo doloribus ipsa?\n           &lt;\/p&gt;\n       &lt;\/div&gt;\n       &lt;footer&gt;\n           &lt;h5&gt;This is a fixed footer.&lt;\/h5&gt;\n       &lt;\/footer&gt;\n   &lt;\/body&gt;\n&lt;\/html&gt;<\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Sticky Footer:<\/h2>\n\n\n\n<div class=\"wp-block-codemirror-blocks-code-block code-block\"><pre>&lt;!DOCTYPE html&gt;\n&lt;html lang=&quot;en&quot;&gt;\n   &lt;head&gt;\n       &lt;meta charset=&quot;UTF-8&quot; \/&gt;\n       &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot; \/&gt;\n       &lt;title&gt;Sticky Footer&lt;\/title&gt;\n   &lt;\/head&gt;\n   &lt;style&gt;\n       .container {\n           min-height: 100vh;\n           display: flex;\n           flex-direction: column;\n       }\n       .page-header, .page-footer {\n           flex-shrink: 0;\n       }\n \n       h1, h2, h3, h4, h5 {\n           text-align: center;\n       }\n \n       .orange {\n           background: orange;\n       }\n       .page-body {\n           background: blue;\n           flex-grow: 1;\n       }\n       .page-body p {\n           text-align: left;\n           width: 80%;\n           margin: 0 auto;\n           line-height: 4rem;\n           font-size: 1.8rem;\n           text-indent: 4rem;\n       }\n       .black {\n           background: black;\n           color: white;\n       }\n   &lt;\/style&gt;\n   &lt;body&gt;\n       &lt;div class=&quot;container&quot;&gt;\n           &lt;header class=&quot;page-header orange&quot;&gt;\n               &lt;h1&gt;This is a header&lt;\/h1&gt;\n           &lt;\/header&gt;\n           &lt;div class=&quot;page-body&quot;&gt;\n               &lt;h2&gt;This is the website content.&lt;\/h2&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n               &lt;p&gt;Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestias neque impedit, libero, officiis repudiandae numquam necessitatibus enim sapiente hic, quam dolores. Atque porro assumenda molestiae. Ipsum laudantium qui odio itaque.&lt;\/p&gt;\n \n           &lt;\/div&gt;\n           &lt;footer class=&quot;page-footer black&quot;&gt;\n               &lt;h5&gt;This is a sticky footer.&lt;\/h5&gt;\n           &lt;\/footer&gt;\n       &lt;\/div&gt;\n   &lt;\/body&gt;\n&lt;\/html&gt;<\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>The fixed footer uses position to keep it at the bottom of the screen. The second uses flexbox\u2019s flex-grow and flex-shrink properties to keep the footer at the bottom of the content. Take notice of the difference in the characteristics of the footer in each of the code examples.&nbsp;<br><\/p>\n\n\n\n<p>Playing in the sandbox environment above will help you understand these patterns. Try changing things up and experimenting with different values.<\/p>\n","protected":false},"excerpt":{"rendered":"Sticky footers are not to be confused with fixed footers \u2013 a sticky footer is a pattern where the footer always sticks either to the bottom of the screen (in cases where content does not fill up the page) or sticks to the bottom of the webpage content. A fixed footer simply stays at the&hellip;","protected":false},"author":77,"featured_media":18784,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[17287],"tags":[],"class_list":{"0":"post-18783","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.0 (Yoast SEO v27.0) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>CSS Sticky Footer: A Step By Step Guide | Career Karma<\/title>\n<meta name=\"description\" content=\"When we don\u2019t have much content to fill our page, we still expect to see our footer at the bottom of the screen. In this article, we\u2019ll learn how to do that using CSS.\" \/>\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-sticky-footer\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Sticky Footer\" \/>\n<meta property=\"og:description\" content=\"When we don\u2019t have much content to fill our page, we still expect to see our footer at the bottom of the screen. In this article, we\u2019ll learn how to do that using CSS.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/\" \/>\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-01T17:29:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-12-29T19:47:38+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1020\" \/>\n\t<meta property=\"og:image:height\" content=\"680\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\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=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/\"},\"author\":{\"name\":\"Christina Kopecky\",\"@id\":\"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e\"},\"headline\":\"CSS Sticky Footer\",\"datePublished\":\"2020-07-01T17:29:49+00:00\",\"dateModified\":\"2020-12-29T19:47:38+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/\"},\"wordCount\":151,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg\",\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/\",\"url\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/\",\"name\":\"CSS Sticky Footer: A Step By Step Guide | Career Karma\",\"isPartOf\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg\",\"datePublished\":\"2020-07-01T17:29:49+00:00\",\"dateModified\":\"2020-12-29T19:47:38+00:00\",\"author\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e\"},\"description\":\"When we don\u2019t have much content to fill our page, we still expect to see our footer at the bottom of the screen. In this article, we\u2019ll learn how to do that using CSS.\",\"breadcrumb\":{\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage\",\"url\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg\",\"contentUrl\":\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg\",\"width\":1020,\"height\":680,\"caption\":\"Person writing on a sticky note on a bulletin board\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#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 Sticky Footer\"}]},{\"@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\/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 Sticky Footer: A Step By Step Guide | Career Karma","description":"When we don\u2019t have much content to fill our page, we still expect to see our footer at the bottom of the screen. In this article, we\u2019ll learn how to do that using CSS.","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-sticky-footer\/","og_locale":"en_US","og_type":"article","og_title":"CSS Sticky Footer","og_description":"When we don\u2019t have much content to fill our page, we still expect to see our footer at the bottom of the screen. In this article, we\u2019ll learn how to do that using CSS.","og_url":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/","og_site_name":"Career Karma","article_publisher":"http:\/\/facebook.com\/careerkarmaapp","article_published_time":"2020-07-01T17:29:49+00:00","article_modified_time":"2020-12-29T19:47:38+00:00","og_image":[{"width":1020,"height":680,"url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg","type":"image\/jpeg"}],"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":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#article","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/"},"author":{"name":"Christina Kopecky","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e"},"headline":"CSS Sticky Footer","datePublished":"2020-07-01T17:29:49+00:00","dateModified":"2020-12-29T19:47:38+00:00","mainEntityOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/"},"wordCount":151,"commentCount":0,"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg","articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/","url":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/","name":"CSS Sticky Footer: A Step By Step Guide | Career Karma","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage"},"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg","datePublished":"2020-07-01T17:29:49+00:00","dateModified":"2020-12-29T19:47:38+00:00","author":{"@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e"},"description":"When we don\u2019t have much content to fill our page, we still expect to see our footer at the bottom of the screen. In this article, we\u2019ll learn how to do that using CSS.","breadcrumb":{"@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/careerkarma.com\/blog\/css-sticky-footer\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#primaryimage","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/person-writing-on-pink-sticky-notes-3854816.jpg","width":1020,"height":680,"caption":"Person writing on a sticky note on a bulletin board"},{"@type":"BreadcrumbList","@id":"https:\/\/careerkarma.com\/blog\/css-sticky-footer\/#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 Sticky Footer"}]},{"@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\/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\/18783","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=18783"}],"version-history":[{"count":0,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/18783\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media\/18784"}],"wp:attachment":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media?parent=18783"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/categories?post=18783"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/tags?post=18783"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}