{"id":6229,"date":"2025-03-20T12:45:21","date_gmt":"2025-03-20T12:45:21","guid":{"rendered":"https:\/\/www.hirist.tech\/blog\/?p=6229"},"modified":"2026-02-03T10:16:01","modified_gmt":"2026-02-03T10:16:01","slug":"top-40-css-interview-questions-and-answers","status":"publish","type":"post","link":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/","title":{"rendered":"Top 40+ CSS Interview Questions and Answers"},"content":{"rendered":"\n<p>CSS is what makes websites look good and function smoothly. If you&#8217;re preparing for a front-end developer interview, knowing CSS inside out is a must. Interviewers often test your understanding of selectors, layouts, animations, and performance tweaks. This guide has 40+ important CSS interview questions with answers, covering both basic and advanced topics. It\u2019ll help you brush up on key concepts and tackle tricky <a href=\"https:\/\/www.hirist.tech\/blog\/tag\/questions\/\" target=\"_blank\" rel=\"noreferrer noopener\">questions<\/a> with confidence.&nbsp;<\/p>\n\n\n\n<p>Let\u2019s get started and make sure you are fully prepared!<\/p>\n\n\n\n<p><strong>Fun Fact:<\/strong> According to data from AmbitionBox, an HTML CSS developer in India can earn between \u20b91.8 Lakhs and \u20b99.0 Lakhs per year, depending on experience and skills.<\/p>\n\n\n\n<p><strong>Note:<\/strong> We have grouped the CSS important questions into different categories like basic, freshers, experienced, and advanced for easier understanding and quick reference.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_65 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title \" >Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#Basic_CSS_Interview_Questions\" title=\"Basic CSS Interview Questions\">Basic CSS Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#Top_CSS_Interview_Questions_for_Fresher\" title=\"Top CSS Interview Questions for Fresher\">Top CSS Interview Questions for Fresher<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Interview_Questions_for_Experienced_Professionals\" title=\"CSS Interview Questions for Experienced Professionals\">CSS Interview Questions for Experienced Professionals<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Interview_Questions_for_2_Years_Experienced\" title=\"CSS Interview Questions for 2 Years Experienced\">CSS Interview Questions for 2 Years Experienced<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Interview_Questions_for_3_Years_Experienced\" title=\"CSS Interview Questions for 3 Years Experienced\">CSS Interview Questions for 3 Years Experienced<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Interview_Questions_for_5_Years_Experienced\" title=\"CSS Interview Questions for 5 Years Experienced\">CSS Interview Questions for 5 Years Experienced<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#Advanced_CSS_Interview_Questions\" title=\"Advanced CSS Interview Questions\">Advanced CSS Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS3_Interview_Questions\" title=\"CSS3 Interview Questions\">CSS3 Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#Tailwind_CSS_Interview_Questions\" title=\"Tailwind CSS Interview Questions\">Tailwind CSS Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Flexbox_Interview_Questions\" title=\"CSS Flexbox Interview Questions\">CSS Flexbox Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Box_Model_Interview_Questions\" title=\"CSS Box Model Interview Questions\">CSS Box Model Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#SCSS_Interview_Questions\" title=\"SCSS Interview Questions\">SCSS Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Coding_Interview_Questions\" title=\"CSS Coding Interview Questions\">CSS Coding Interview Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#CSS_Viva_Questions\" title=\"CSS Viva Questions\">CSS Viva Questions<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#Wrapping_Up\" title=\"Wrapping Up\">Wrapping Up<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Basic_CSS_Interview_Questions\"><\/span>Basic CSS Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here is a list of CSS basic interview questions and answers:<\/p>\n\n\n\n<ol>\n<li><strong>What is CSS, and how does it work in web development?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>CSS (Cascading Style Sheets) is a language used to style HTML elements. It controls the layout, colours, fonts, and responsiveness of web pages. Browsers interpret CSS rules to render a website\u2019s appearance based on selectors, properties, and values.<\/p>\n\n\n\n<ol start=\"2\">\n<li><strong>What are the different ways to apply CSS to a webpage?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>CSS can be applied in three ways:<\/p>\n\n\n\n<ul>\n<li><strong>Inline CSS<\/strong>: Applied directly to an element using the style attribute.<\/li>\n\n\n\n<li><strong>Internal CSS<\/strong>: Defined within a &lt;style&gt; tag inside the HTML document.<\/li>\n\n\n\n<li><strong>External CSS<\/strong>: Stored in a separate .css file and linked using &lt;link&gt;.<\/li>\n<\/ul>\n\n\n\n<ol start=\"3\">\n<li><strong>What is the difference between relative, absolute, fixed, and sticky positioning in CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Relative<\/strong>: Positioned relative to its normal position.<\/li>\n\n\n\n<li><strong>Absolute<\/strong>: Positioned relative to the nearest positioned ancestor or the viewport if none exists.<\/li>\n\n\n\n<li><strong>Fixed<\/strong>: Stays in place relative to the viewport, even when scrolling.<\/li>\n\n\n\n<li><strong>Sticky<\/strong>: Acts like relative until it reaches a defined scroll position, then behaves like fixed.<\/li>\n<\/ul>\n\n\n\n<ol start=\"4\">\n<li><strong>How do you apply styles to multiple elements using CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>You can use classes, element selectors, grouping selectors, and universal selectors.&nbsp;<\/p>\n\n\n\n<p><strong>For example:<\/strong><\/p>\n\n\n\n<p>p, h1, .box { colour: blue; }<\/p>\n\n\n\n<p>This applies the same style to all &lt;p&gt;, &lt;h1&gt;, and elements with class box.<\/p>\n\n\n\n<ol start=\"5\">\n<li><strong>What is the difference between classes and IDs in CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Class (.)<\/strong>: Can be applied to multiple elements. Example: .button { colour: red; }.<\/li>\n\n\n\n<li><strong>ID (#)<\/strong>: Unique to one element per page. Example: #header { font-size: 20px; }.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Top_CSS_Interview_Questions_for_Fresher\"><\/span>Top CSS Interview Questions for Fresher<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here are the commonly-asked CSS interview questions and answers for freshers:&nbsp;<\/p>\n\n\n\n<ol start=\"6\">\n<li><strong>What is the difference between inline, internal, and external CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Inline CSS<\/strong>: Applied inside an HTML tag, affecting only that element.<\/li>\n\n\n\n<li><strong>Internal CSS<\/strong>: Defined inside a &lt;style&gt; tag within the &lt;head&gt;. Affects the entire page.<\/li>\n\n\n\n<li><strong>External CSS<\/strong>: Stored in a separate file (.css) and linked using &lt;link&gt;, allowing reuse across multiple pages.<\/li>\n<\/ul>\n\n\n\n<ol start=\"7\">\n<li><strong>What are pseudo-classes and pseudo-elements in CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Pseudo-classes<\/strong>: Apply styles to elements based on state (:hover, :focus).<\/li>\n\n\n\n<li><strong>Pseudo-elements<\/strong>: Style parts of an element (::before, ::after).<\/li>\n<\/ul>\n\n\n\n<ol start=\"8\">\n<li><strong>How does the z-index property work?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>z-index controls the stacking order of elements. Higher values appear above lower ones. It only works on positioned elements (relative, absolute, fixed).<\/p>\n\n\n\n<ol start=\"9\">\n<li><strong>What is the difference between em, rem, vw, and % units in CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>em: Relative to the font size of the parent.<\/li>\n\n\n\n<li>rem: Relative to the root element\u2019s font size.<\/li>\n\n\n\n<li>vw: 1% of the viewport width.<\/li>\n\n\n\n<li>%: Relative to the parent element.<\/li>\n<\/ul>\n\n\n\n<ol start=\"10\">\n<li><strong>What is the default position of an HTML element?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>By default, elements are static, meaning they follow the normal document flow.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Interview_Questions_for_Experienced_Professionals\"><\/span>CSS Interview Questions for Experienced Professionals<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Let\u2019s go through the important CSS interview questions and answers for experienced candidates:&nbsp;<\/p>\n\n\n\n<ol start=\"11\">\n<li><strong>What are CSS variables, and how do you use them?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>CSS variables store reusable values. Example:<\/p>\n\n\n\n<p>:root { &#8211;main-colour: blue; }<\/p>\n\n\n\n<p>h1 { colour: var(&#8211;main-colour); }<\/p>\n\n\n\n<p>They improve maintainability and flexibility in styling.<\/p>\n\n\n\n<ol start=\"12\">\n<li><strong>How do you optimize CSS for performance?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>Minify CSS files to reduce size.<\/li>\n\n\n\n<li>Remove unused CSS.<\/li>\n\n\n\n<li>Use shorthand properties.<\/li>\n\n\n\n<li>Avoid excessive use of !important.<\/li>\n\n\n\n<li>Use efficient selectors (avoid universal selectors like *).<\/li>\n\n\n\n<li>Use CSS subgrid for better nested layouts without extra div wrappers.<\/li>\n<\/ul>\n\n\n\n<ol start=\"13\">\n<li><strong>What is the difference between Grid and Flexbox?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Flexbox<\/strong>: One-dimensional layout (row or column). Best for arranging items inside a container.<\/li>\n\n\n\n<li><strong>Grid<\/strong>: Two-dimensional layout (rows and columns). Best for full-page structures.<\/li>\n<\/ul>\n\n\n\n<ol start=\"14\">\n<li><strong>How can you create a responsive design without using media queries?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>Use flexbox and grid for adaptable layouts.<\/li>\n\n\n\n<li>Use relative units (em, rem, %, vw, vh).<\/li>\n\n\n\n<li>Use CSS clamp(), max-width, and min-width for fluid scaling.<\/li>\n\n\n\n<li>Use container queries (@container) to style elements based on their container\u2019s size rather than viewport size.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Interview_Questions_for_2_Years_Experienced\"><\/span>CSS Interview Questions for 2 Years Experienced<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>You might come across these interview CSS questions if you have 2 years of experience:&nbsp;<\/p>\n\n\n\n<ol start=\"15\">\n<li><strong>Can you describe a project where you used advanced CSS techniques?&nbsp;<\/strong><\/li>\n<\/ol>\n\n\n\n<p><em>\u201cIn one project, I built a complex dashboard using CSS Grid and Flexbox for a fully responsive layout. I used CSS variables to maintain consistency and clip-path for creative UI elements. The challenge was optimizing rendering speed, so I used will-change for smoother animations and content-visibility: auto to boost performance by delaying rendering of offscreen content.\u201d<\/em><\/p>\n\n\n\n<p><strong>How do you handle disagreements with designers over CSS implementation?&nbsp;<\/strong><\/p>\n\n\n\n<p><em>\u201cI listen to their vision first and then explain any technical constraints. If a proposed design affects performance, I offer alternatives that maintain the look while improving efficiency. When needed, I create quick prototypes to compare different approaches and align on the best solution.\u201d<\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Interview_Questions_for_3_Years_Experienced\"><\/span>CSS Interview Questions for 3 Years Experienced<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>If you have around three years of experience, you might encounter such interview CSS questions:&nbsp;<\/p>\n\n\n\n<ol start=\"16\">\n<li><strong>Have you ever optimized a webpage\u2019s loading speed using CSS?&nbsp;<\/strong><\/li>\n<\/ol>\n\n\n\n<p><em>\u201cYes, I worked on a project where large CSS files slowed the page. I refactored styles by removing unused rules, using minification, and replacing large background images with CSS gradients. I also switched from custom fonts to system fonts where possible, reducing load time significantly.\u201d<\/em><\/p>\n\n\n\n<ol start=\"17\">\n<li><strong>How do you manage CSS in a large-scale project with multiple developers?&nbsp;<\/strong><\/li>\n<\/ol>\n\n\n\n<p><em>\u201cI use a structured approach with a CSS methodology like BEM or utility-first CSS. We maintain a shared style guide and modular components to keep styles consistent. Version control and PR reviews help prevent conflicts, and we document reusable patterns for clarity.\u201d<\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Interview_Questions_for_5_Years_Experienced\"><\/span>CSS Interview Questions for 5 Years Experienced<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<ol start=\"18\">\n<li><strong>What is the most complex CSS challenge you\u2019ve solved in your career?&nbsp;<\/strong><\/li>\n<\/ol>\n\n\n\n<p><em>\u201cI once had to implement a fully responsive, complex table with sticky headers and dynamically changing column widths. Standard solutions failed due to content overflow issues. I used display: grid inside a scrollable container and position: sticky strategically to keep headers in place while maintaining alignment across screen sizes.\u201d<\/em><\/p>\n\n\n\n<ol start=\"19\">\n<li><strong>How do you mentor junior developers in writing maintainable CSS?&nbsp;<\/strong><\/li>\n<\/ol>\n\n\n\n<p><em>\u201cI encourage them to follow CSS best practices, use clear naming conventions, and write modular styles. During code reviews, I provide constructive feedback and suggest improvements. I also share resources and pair-program to help them understand advanced CSS concepts.\u201d<\/em><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Advanced_CSS_Interview_Questions\"><\/span>Advanced CSS Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>These are some advanced CSS interview questions and answers:<\/p>\n\n\n\n<ol start=\"20\">\n<li><strong>How does the will-change property impact rendering performance?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>will-change hints to the browser about upcoming animations or layout shifts, allowing it to optimize rendering in advance. However, excessive use can consume memory, so it should be applied only when necessary and removed after use.<\/p>\n\n\n\n<ol start=\"21\">\n<li><strong>What is the difference between contain and content-visibility in CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>contain: Controls layout, paint, and size containment for elements, improving performance by restricting rendering scope.<\/li>\n\n\n\n<li>content-visibility: auto: Prevents offscreen elements from rendering until they are needed, reducing initial load time and improving performance.<\/li>\n<\/ul>\n\n\n\n<ol start=\"22\">\n<li><strong>How do you create a pure CSS animation without JavaScript?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Using @keyframes and animation:<\/p>\n\n\n\n<p>@keyframes fadeIn {<\/p>\n\n\n\n<p>&nbsp;&nbsp;from { opacity: 0; }<\/p>\n\n\n\n<p>&nbsp;&nbsp;to { opacity: 1; }<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>.element {<\/p>\n\n\n\n<p>&nbsp;&nbsp;animation: fadeIn 1s ease-in-out;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>This smoothly fades in an element without JavaScript.<\/p>\n\n\n\n<p><strong>Note:<\/strong> Each CSS question and answer here covers advanced topics to help you succeed in senior-level interviews.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS3_Interview_Questions\"><\/span>CSS3 Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>You might also come across CSS3 interview questions like these:<\/p>\n\n\n\n<ol start=\"23\">\n<li><strong>What are the new features introduced in CSS3?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>CSS3 introduced features like Flexbox, Grid, CSS variables, transitions, animations, and media queries for responsive design.<\/p>\n\n\n\n<ol start=\"24\">\n<li><strong>How do CSS3 transitions and animations work?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Transitions<\/strong> animate property changes between states. Example:<\/li>\n<\/ul>\n\n\n\n<p>div { transition: background-colour 0.5s ease-in-out; }<\/p>\n\n\n\n<ul>\n<li><strong>Animations<\/strong> use @keyframes for more control over multiple stages.<\/li>\n<\/ul>\n\n\n\n<ol start=\"25\">\n<li><strong>What is the difference between @keyframes and transition?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>transition: Works only when a property changes (e.g., on hover).<\/li>\n\n\n\n<li>@keyframes: Allows complex animations with multiple states, independent of user actions.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Tailwind_CSS_Interview_Questions\"><\/span>Tailwind CSS Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here are some important Tailwind CSS interview questions and answers:&nbsp;<\/p>\n\n\n\n<ol start=\"26\">\n<li><strong>What are the advantages of using Tailwind CSS over traditional CSS frameworks?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Tailwind is utility-first, meaning styles are applied using small, reusable classes like bg-blue-500 instead of writing custom CSS. This makes development faster and keeps styles consistent across projects.<\/p>\n\n\n\n<ol start=\"27\">\n<li><strong>How do you customize Tailwind CSS for a project?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Tailwind can be customized using the tailwind.config.js file. Developers can define custom colours, fonts, and spacing values to match branding requirements.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Flexbox_Interview_Questions\"><\/span>CSS Flexbox Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>These are some common CSS Flexbox interview questions and answers:&nbsp;<\/p>\n\n\n\n<ol start=\"28\">\n<li><strong>What are the different properties of a flex container and flex items?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>A flex container uses display: flex; and has properties like:<\/p>\n\n\n\n<ul>\n<li>flex-direction: Defines the main axis (row, column).<\/li>\n\n\n\n<li>justify-content: Aligns items along the main axis.<\/li>\n\n\n\n<li>align-items: Aligns items along the cross axis.<\/li>\n<\/ul>\n\n\n\n<p>A flex item inside a flex container has properties like:<\/p>\n\n\n\n<ul>\n<li>flex-grow: Controls how much an item expands.<\/li>\n\n\n\n<li>flex-shrink: Defines how much an item shrinks.<\/li>\n\n\n\n<li>align-self: Aligns a single item differently from others.<\/li>\n<\/ul>\n\n\n\n<ol start=\"29\">\n<li><strong>How does align-items differ from align-self in Flexbox?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>align-items applies to all flex items inside a container.<\/li>\n\n\n\n<li>align-self applies only to a specific flex item, overriding align-items if set.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Box_Model_Interview_Questions\"><\/span>CSS Box Model Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here are common interview CSS questions on Box Model:&nbsp;<\/p>\n\n\n\n<ol start=\"30\">\n<li><strong>What are the four main components of the CSS Box Model?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li><strong>Content<\/strong>: The actual text or image inside the element.<\/li>\n\n\n\n<li><strong>Padding<\/strong>: Space between the content and the border.<\/li>\n\n\n\n<li><strong>Border<\/strong>: The outline surrounding the padding and content.<\/li>\n\n\n\n<li><strong>Margin<\/strong>: Space outside the border separating elements.<\/li>\n<\/ul>\n\n\n\n<ol start=\"31\">\n<li><strong>How does box-sizing: border-box; affect element dimensions?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>By default, width and height include only the content. border-box makes width and height include padding and border, preventing unexpected layout shifts.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"SCSS_Interview_Questions\"><\/span>SCSS Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<ol start=\"32\">\n<li><strong>What are the key differences between SCSS and regular CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>SCSS (Sassy CSS) is a preprocessor with features like:<\/p>\n\n\n\n<ul>\n<li>Variables ($primary-colour: blue;).<\/li>\n\n\n\n<li>Nesting (nav { ul { li { colour: red; } } }).<\/li>\n\n\n\n<li>Mixins for reusable styles.<\/li>\n<\/ul>\n\n\n\n<ol start=\"33\">\n<li><strong>How do mixins work in SCSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Mixins store reusable styles and allow arguments. Example:<\/p>\n\n\n\n<p>@mixin button-style($colour) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;background: $colour;<\/p>\n\n\n\n<p>&nbsp;&nbsp;padding: 10px;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>button { @include button-style(blue); }<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Coding_Interview_Questions\"><\/span>CSS Coding Interview Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here is a list of CSS practical questions and their solution:&nbsp;<\/p>\n\n\n\n<ol start=\"34\">\n<li><strong>How do you create a pure CSS tooltip without JavaScript?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Use the title attribute or a ::after pseudo-element:<\/p>\n\n\n\n<p>.tooltip:hover::after {<\/p>\n\n\n\n<p>&nbsp;&nbsp;content: &#8220;Tooltip text&#8221;;<\/p>\n\n\n\n<p>&nbsp;&nbsp;position: absolute;<\/p>\n\n\n\n<p>&nbsp;&nbsp;background: black;<\/p>\n\n\n\n<p>&nbsp;&nbsp;colour: white;<\/p>\n\n\n\n<p>&nbsp;&nbsp;padding: 5px;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<ol start=\"35\">\n<li><strong>How do you make a div centre both vertically and horizontally without using Flexbox?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Using position: absolute and transform:<\/p>\n\n\n\n<p>.centred {<\/p>\n\n\n\n<p>&nbsp;&nbsp;position: absolute;<\/p>\n\n\n\n<p>&nbsp;&nbsp;top: 50%;<\/p>\n\n\n\n<p>&nbsp;&nbsp;left: 50%;<\/p>\n\n\n\n<p>&nbsp;&nbsp;transform: translate(-50%, -50%);<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<ol start=\"36\">\n<li><strong>How would you create a CSS-only dropdown menu?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Use the :hover selector:<\/p>\n\n\n\n<p>.dropdown:hover .dropdown-menu {<\/p>\n\n\n\n<p>&nbsp;&nbsp;display: block;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>By default, .dropdown-menu is display: none;.<\/p>\n\n\n\n<ol start=\"37\">\n<li><strong>How do you create a loading spinner using only CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Using @keyframes and border:<\/p>\n\n\n\n<p>.loader {<\/p>\n\n\n\n<p>&nbsp;&nbsp;width: 40px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;height: 40px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;border: 5px solid lightgray;<\/p>\n\n\n\n<p>&nbsp;&nbsp;border-top: 5px solid blue;<\/p>\n\n\n\n<p>&nbsp;&nbsp;border-radius: 50%;<\/p>\n\n\n\n<p>&nbsp;&nbsp;animation: spin 1s linear infinite;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>@keyframes spin {<\/p>\n\n\n\n<p>&nbsp;&nbsp;100% { transform: rotate(360deg); }<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"CSS_Viva_Questions\"><\/span>CSS Viva Questions<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Apart from interview CSS questions, you must also prepare for CSS viva questions:&nbsp;<\/p>\n\n\n\n<ol start=\"38\">\n<li><strong>What is the difference between nth-child and nth-of-type?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>nth-child(n): Targets the nth child regardless of type.<\/li>\n\n\n\n<li>nth-of-type(n): Targets the nth child of a specific type.<\/li>\n<\/ul>\n\n\n\n<ol start=\"39\">\n<li><strong>How do you hide an element in CSS without using display: none;?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>visibility: hidden; (Hides but keeps space).<\/li>\n\n\n\n<li>opacity: 0; (Invisible but interactive).<\/li>\n\n\n\n<li>position: absolute; left: -9999px; (Moves offscreen).<\/li>\n<\/ul>\n\n\n\n<ol start=\"40\">\n<li><strong>What are the differences between visibility: hidden; and opacity: 0;?<\/strong><\/li>\n<\/ol>\n\n\n\n<ul>\n<li>visibility: hidden; removes the element from visibility but retains space in the layout.<\/li>\n\n\n\n<li>opacity: 0; makes the element invisible but it still occupies space and is clickable unless pointer-events: none; is applied.<\/li>\n<\/ul>\n\n\n\n<ol start=\"41\">\n<li><strong>What is specificity in CSS, and how does it work?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Specificity determines which CSS rule takes priority. The order:<\/p>\n\n\n\n<ul>\n<li>Inline styles (1000).<\/li>\n\n\n\n<li>IDs (100).<\/li>\n\n\n\n<li>Classes, attributes, and pseudo-classes (10).<\/li>\n\n\n\n<li>Elements and pseudo-elements (1).<\/li>\n<\/ul>\n\n\n\n<p>The :where() selector can be used to apply styles without increasing specificity.<\/p>\n\n\n\n<ol start=\"42\">\n<li><strong>How do media queries work in CSS?<\/strong><\/li>\n<\/ol>\n\n\n\n<p>Media queries apply styles based on screen size or device type. Example:<\/p>\n\n\n\n<p>@media (max-width: 600px) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;body { background: lightgray; }<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>This changes the background colour for screens smaller than 600px.<\/p>\n\n\n\n<p>Use @media (prefers-reduced-motion: reduce) {} to disable animations for users who prefer minimal motion effects.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Wrapping_Up\"><\/span>Wrapping Up<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>With these CSS interview questions and answers, you\u2019ll be better prepared for your next web development interview. From basic concepts to advanced techniques, mastering CSS is key to landing a great job in front-end development. Looking for top <a href=\"https:\/\/www.hirist.tech\/k\/css-jobs.html?ref=blog\" target=\"_blank\" rel=\"noreferrer noopener\">CSS job opportunities<\/a>? Hirist is the go-to platform for tech professionals in India. Find the best CSS jobs today!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>CSS is what makes websites look good and function smoothly. If you&#8217;re preparing for a&hellip;<\/p>\n","protected":false},"author":1,"featured_media":9343,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[29,19,26],"tags":[32,34,33],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Top 40+ CSS Interview Questions and Answers (2026) - Hirist Blog<\/title>\n<meta name=\"description\" content=\"Get the top 40+ CSS interview questions &amp; answers for freshers and experienced. It covers basic to advanced topics of CSS3.\" \/>\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.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Top 40+ CSS Interview Questions and Answers (2026) - Hirist Blog\" \/>\n<meta property=\"og:description\" content=\"Get the top 40+ CSS interview questions &amp; answers for freshers and experienced. It covers basic to advanced topics of CSS3.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/\" \/>\n<meta property=\"og:site_name\" content=\"Hirist Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hirist.jobs\" \/>\n<meta property=\"article:published_time\" content=\"2025-03-20T12:45:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-03T10:16:01+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1000\" \/>\n\t<meta property=\"og:image:height\" content=\"667\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"hiristBlog\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"hiristBlog\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/\",\"url\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/\",\"name\":\"Top 40+ CSS Interview Questions and Answers (2026) - Hirist Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.hirist.tech\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp\",\"datePublished\":\"2025-03-20T12:45:21+00:00\",\"dateModified\":\"2026-02-03T10:16:01+00:00\",\"author\":{\"@id\":\"https:\/\/www.hirist.tech\/blog\/#\/schema\/person\/f40a5a435d73195ec4e424a307b0c26b\"},\"description\":\"Get the top 40+ CSS interview questions & answers for freshers and experienced. It covers basic to advanced topics of CSS3.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#primaryimage\",\"url\":\"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp\",\"contentUrl\":\"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp\",\"width\":1000,\"height\":667,\"caption\":\"css interview questions\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.hirist.tech\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Top 40+ CSS Interview Questions and Answers\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.hirist.tech\/blog\/#website\",\"url\":\"https:\/\/www.hirist.tech\/blog\/\",\"name\":\"Hirist Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.hirist.tech\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.hirist.tech\/blog\/#\/schema\/person\/f40a5a435d73195ec4e424a307b0c26b\",\"name\":\"hiristBlog\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.hirist.tech\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/1d0fb418cc48cd31b61160060c199240?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/1d0fb418cc48cd31b61160060c199240?s=96&d=mm&r=g\",\"caption\":\"hiristBlog\"},\"sameAs\":[\"https:\/\/www.hirist.tech\/blog\"],\"url\":\"https:\/\/www.hirist.tech\/blog\/author\/hiristblog\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Top 40+ CSS Interview Questions and Answers (2026) - Hirist Blog","description":"Get the top 40+ CSS interview questions & answers for freshers and experienced. It covers basic to advanced topics of CSS3.","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.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/","og_locale":"en_US","og_type":"article","og_title":"Top 40+ CSS Interview Questions and Answers (2026) - Hirist Blog","og_description":"Get the top 40+ CSS interview questions & answers for freshers and experienced. It covers basic to advanced topics of CSS3.","og_url":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/","og_site_name":"Hirist Blog","article_publisher":"https:\/\/www.facebook.com\/hirist.jobs","article_published_time":"2025-03-20T12:45:21+00:00","article_modified_time":"2026-02-03T10:16:01+00:00","og_image":[{"width":1000,"height":667,"url":"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp","type":"image\/webp"}],"author":"hiristBlog","twitter_card":"summary_large_image","twitter_misc":{"Written by":"hiristBlog","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/","url":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/","name":"Top 40+ CSS Interview Questions and Answers (2026) - Hirist Blog","isPartOf":{"@id":"https:\/\/www.hirist.tech\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#primaryimage"},"image":{"@id":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#primaryimage"},"thumbnailUrl":"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp","datePublished":"2025-03-20T12:45:21+00:00","dateModified":"2026-02-03T10:16:01+00:00","author":{"@id":"https:\/\/www.hirist.tech\/blog\/#\/schema\/person\/f40a5a435d73195ec4e424a307b0c26b"},"description":"Get the top 40+ CSS interview questions & answers for freshers and experienced. It covers basic to advanced topics of CSS3.","breadcrumb":{"@id":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#primaryimage","url":"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp","contentUrl":"https:\/\/www.hirist.tech\/blog\/wp-content\/uploads\/2025\/03\/css-interview-questions.webp","width":1000,"height":667,"caption":"css interview questions"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hirist.tech\/blog\/top-40-css-interview-questions-and-answers\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hirist.tech\/blog\/"},{"@type":"ListItem","position":2,"name":"Top 40+ CSS Interview Questions and Answers"}]},{"@type":"WebSite","@id":"https:\/\/www.hirist.tech\/blog\/#website","url":"https:\/\/www.hirist.tech\/blog\/","name":"Hirist Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hirist.tech\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.hirist.tech\/blog\/#\/schema\/person\/f40a5a435d73195ec4e424a307b0c26b","name":"hiristBlog","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hirist.tech\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/1d0fb418cc48cd31b61160060c199240?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/1d0fb418cc48cd31b61160060c199240?s=96&d=mm&r=g","caption":"hiristBlog"},"sameAs":["https:\/\/www.hirist.tech\/blog"],"url":"https:\/\/www.hirist.tech\/blog\/author\/hiristblog\/"}]}},"_links":{"self":[{"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/posts\/6229"}],"collection":[{"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/comments?post=6229"}],"version-history":[{"count":11,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/posts\/6229\/revisions"}],"predecessor-version":[{"id":8699,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/posts\/6229\/revisions\/8699"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/media\/9343"}],"wp:attachment":[{"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/media?parent=6229"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/categories?post=6229"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hirist.tech\/blog\/wp-json\/wp\/v2\/tags?post=6229"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}