{"id":4900,"date":"2015-06-15T12:15:35","date_gmt":"2015-06-15T09:15:35","guid":{"rendered":"http:\/\/www.webcodegeeks.com\/?p=4900"},"modified":"2018-01-08T14:35:42","modified_gmt":"2018-01-08T12:35:42","slug":"css-display-inline-block-example","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/","title":{"rendered":"CSS Display Inline-Block Example"},"content":{"rendered":"<p>In this example, we&#8217;re having a look at the <code>display<\/code> property of css.<\/p>\n<p>Specifically, lets see the <code>inline-block<\/code> value that can be given to it.<\/p>\n<p>You could previously use float to make elements stretch throughout the browser width, while now it is all easier with the inline-block value.<\/p>\n<p>Basically, it\u2019s a way to make elements inline, preserving their block capabilities such as width and height, margins and paddings etc.<\/p>\n<p>It is supported by all browsers and you do not need any extra piece of code like you do in some cases to make it functional like -ms, -moz etc.<br \/>\n&nbsp;<br \/>\n&nbsp;<br \/>\n[ulp id=&#8217;nAkUl5IbAjqlXSla&#8217;]<\/p>\n<h2>1. Basic Setup <\/h2>\n<p>Go ahead and create a new html document and add the basic sytnax in it like so:<\/p>\n<pre class=\"brush:xml\">\r\n&lt;!DOCTYPE html&gt;\r\n&lt;html&gt;\r\n&lt;head&gt;\r\n\t&lt;title&gt;CSS Display Inline Block&lt;\/title&gt;\r\n&lt;\/head&gt;\r\n&lt;body&gt;\r\n\r\n&lt;!-- STYLE SECTION --&gt;\r\n\r\n&lt;style type=\"text\/css\"&gt;\r\n\r\n&lt;\/style&gt;\r\n\r\n&lt;!-- HTML SECTION --&gt;\r\n\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;\r\n<\/pre>\n<h2>2. Application and Cases <\/h2>\n<p>To see the property in action, first add some lines of elements in html:<\/p>\n<pre class=\"brush:xml\">\r\n&lt;!-- HTML SECTION  --&gt;\r\n\r\n&lt;div class=\"item\"&gt;Element 1&lt;\/div&gt;\r\n&lt;div class=\"item\"&gt;Element 2&lt;\/div&gt;\r\n&lt;div class=\"item\"&gt;Element 3&lt;\/div&gt;\r\n&lt;div class=\"item\"&gt;Element 4&lt;\/div&gt;\r\n&lt;div class=\"item\"&gt;Element 5&lt;\/div&gt;\r\n<\/pre>\n<p>Now add some border, width and height properties to the <code>item<\/code> class to create a view of boxes.<\/p>\n<p>Also add the <code>display: inline-block<\/code>. Look at the code below:<\/p>\n<pre class=\"brush:css\">\r\n&lt;!-- STYLE  SECTION --&gt;\r\n\r\n&lt;style type=\"text\/css\"&gt;\r\n.item {\r\n\twidth: 8em;\r\n\theight: 3em;\r\n\tborder: 0.3em solid #ccc;\r\n\tdisplay: inline-block;\r\n}\r\n&lt;\/style&gt;\r\n<\/pre>\n<p>You would get the following view:<br \/>\n<figure id=\"attachment_4912\" aria-describedby=\"caption-attachment-4912\" style=\"width: 820px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block1.jpg\"><img decoding=\"async\" src=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block1.jpg\" alt=\"Basic Application of the Inline-Block Property Value\" width=\"820\" height=\"243\" class=\"size-full wp-image-4912\" srcset=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block1.jpg 820w, https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block1-300x89.jpg 300w\" sizes=\"(max-width: 820px) 100vw, 820px\" \/><\/a><figcaption id=\"caption-attachment-4912\" class=\"wp-caption-text\">Basic Application of the Inline-Block Property Value<\/figcaption><\/figure><\/p>\n<p>But to show the real advantage of using inline-block, lets give elements different widths and heights and see how it handles.<\/p>\n<p>Now give elements in html distinct classes like item1, item2, item3 etc:<\/p>\n<pre class=\"brush:xml\">\r\n&lt;!-- HTML SECTION  --&gt;\r\n\r\n&lt;div class=\"item1\"&gt;Element 1&lt;\/div&gt;\r\n&lt;div class=\"item2\"&gt;Element 2&lt;\/div&gt;\r\n&lt;div class=\"item3\"&gt;Element 3&lt;\/div&gt;\r\n&lt;div class=\"item4\"&gt;Element 4&lt;\/div&gt;\r\n&lt;div class=\"item5\"&gt;Element 5&lt;\/div&gt;\r\n<\/pre>\n<p>Next, change widths and heights of different elements so that you do not have same size boxes:<\/p>\n<pre class=\"brush:css\">\r\n&lt;!-- STYLE  SECTION --&gt;\r\n\r\n&lt;style type=\"text\/css\"&gt;\r\n.item1 {\r\n\twidth: 6em;\r\n\theight: 3em;\r\n\tborder: 0.3em solid #ccc;\r\n\tdisplay: inline-block;\r\n}\r\n\r\n.item2 {\r\n\twidth: 7em;\r\n\theight: 4em;\r\n\tborder: 0.3em solid #ccc;\r\n\tdisplay: inline-block;\r\n}\r\n\r\n.item3 {\r\n\twidth: 8em;\r\n\theight: 5em;\r\n\tborder: 0.3em solid #ccc;\r\n\tdisplay: inline-block;\r\n}\r\n\r\n.item4 {\r\n\twidth: 9em;\r\n\theight: 6em;\r\n\tborder: 0.3em solid #ccc;\r\n\tdisplay: inline-block;\r\n}\r\n\r\n.item5 {\r\n\twidth: 10em;\r\n\theight: 7em;\r\n\tborder: 0.3em solid #ccc;\r\n\tdisplay: inline-block;\r\n}\r\n&lt;\/style&gt;\r\n<\/pre>\n<p>That&#8217;s it, the view would maintain its positioning and align elements one after the other:<br \/>\n<figure id=\"attachment_4916\" aria-describedby=\"caption-attachment-4916\" style=\"width: 820px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block2.jpg\"><img decoding=\"async\" src=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block2.jpg\" alt=\"Different Element Width and Height with Inline Block Applied\" width=\"820\" height=\"243\" class=\"size-full wp-image-4916\" srcset=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block2.jpg 820w, https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/inline-block2-300x89.jpg 300w\" sizes=\"(max-width: 820px) 100vw, 820px\" \/><\/a><figcaption id=\"caption-attachment-4916\" class=\"wp-caption-text\">Different Element Width and Height with Inline Block Applied<\/figcaption><\/figure><\/p>\n<h2>3. Conclusion <\/h2>\n<p>To conclude, we can say that it is better to use display: inline-block property and value rather than float.<\/p>\n<p>You can work around different elements and see its applications in many more cases on your own.<\/p>\n<p>Do remember that elements will be inline just as the browser width, so consider even mobile browsers when coding.<\/p>\n<h2>4. Download <\/h2>\n<div class=\"download\"><strong>Download<\/strong><br \/>\nYou can download the full source code of this example here: <a href=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2015\/05\/CSS-Display-Inline-Block.zip\"><strong>CSS Display Inline Block<\/strong><\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>In this example, we&#8217;re having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could previously use float to make elements stretch throughout the browser width, while now it is all easier with the inline-block value. Basically, it\u2019s a way to make elements &hellip;<\/p>\n","protected":false},"author":75,"featured_media":917,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[],"class_list":["post-4900","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>CSS Display Inline-Block Example - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"In this example, we&#039;re having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could\" \/>\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.webcodegeeks.com\/css\/css-display-inline-block-example\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Display Inline-Block Example - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"In this example, we&#039;re having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webcodegeeks\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/fabiocimo\" \/>\n<meta property=\"article:published_time\" content=\"2015-06-15T09:15:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-01-08T12:35:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Fabio Cimo\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@fabiocimo\" \/>\n<meta name=\"twitter:site\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fabio Cimo\" \/>\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:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/\"},\"author\":{\"name\":\"Fabio Cimo\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22\"},\"headline\":\"CSS Display Inline-Block Example\",\"datePublished\":\"2015-06-15T09:15:35+00:00\",\"dateModified\":\"2018-01-08T12:35:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/\"},\"wordCount\":345,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/\",\"name\":\"CSS Display Inline-Block Example - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"datePublished\":\"2015-06-15T09:15:35+00:00\",\"dateModified\":\"2018-01-08T12:35:42+00:00\",\"description\":\"In this example, we're having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/css\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"CSS Display Inline-Block Example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"name\":\"Web Code Geeks\",\"description\":\"Web Developers Resource Center\",\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.webcodegeeks.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webcodegeeks\",\"https:\/\/x.com\/webcodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22\",\"name\":\"Fabio Cimo\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g\",\"caption\":\"Fabio Cimo\"},\"description\":\"Fabio is a passionate student in web tehnologies including front-end (HTML\/CSS) and web design. He likes exploring as much as possible about the world wide web and how it can be more productive for us all. Currently he studies Computer Engineering, at the same time he works as a freelancer on both web programming and graphic design.\",\"sameAs\":[\"https:\/\/www.facebook.com\/fabiocimo\",\"https:\/\/al.linkedin.com\/in\/fabiocimo\",\"https:\/\/x.com\/fabiocimo\",\"https:\/\/www.youtube.com\/fabiocimo1\"],\"url\":\"https:\/\/www.webcodegeeks.com\/author\/fabio-cimo\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"CSS Display Inline-Block Example - Web Code Geeks - 2026","description":"In this example, we're having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could","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.webcodegeeks.com\/css\/css-display-inline-block-example\/","og_locale":"en_US","og_type":"article","og_title":"CSS Display Inline-Block Example - Web Code Geeks - 2026","og_description":"In this example, we're having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could","og_url":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/","og_site_name":"Web Code Geeks","article_publisher":"https:\/\/www.facebook.com\/webcodegeeks","article_author":"https:\/\/www.facebook.com\/fabiocimo","article_published_time":"2015-06-15T09:15:35+00:00","article_modified_time":"2018-01-08T12:35:42+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","type":"image\/jpeg"}],"author":"Fabio Cimo","twitter_card":"summary_large_image","twitter_creator":"@fabiocimo","twitter_site":"@webcodegeeks","twitter_misc":{"Written by":"Fabio Cimo","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/"},"author":{"name":"Fabio Cimo","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22"},"headline":"CSS Display Inline-Block Example","datePublished":"2015-06-15T09:15:35+00:00","dateModified":"2018-01-08T12:35:42+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/"},"wordCount":345,"commentCount":0,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/","url":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/","name":"CSS Display Inline-Block Example - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","datePublished":"2015-06-15T09:15:35+00:00","dateModified":"2018-01-08T12:35:42+00:00","description":"In this example, we're having a look at the display property of css. Specifically, lets see the inline-block value that can be given to it. You could","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/css\/css-display-inline-block-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"CSS","item":"https:\/\/www.webcodegeeks.com\/category\/css\/"},{"@type":"ListItem","position":3,"name":"CSS Display Inline-Block Example"}]},{"@type":"WebSite","@id":"https:\/\/www.webcodegeeks.com\/#website","url":"https:\/\/www.webcodegeeks.com\/","name":"Web Code Geeks","description":"Web Developers Resource Center","publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.webcodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.webcodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.webcodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webcodegeeks","https:\/\/x.com\/webcodegeeks"]},{"@type":"Person","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22","name":"Fabio Cimo","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g","caption":"Fabio Cimo"},"description":"Fabio is a passionate student in web tehnologies including front-end (HTML\/CSS) and web design. He likes exploring as much as possible about the world wide web and how it can be more productive for us all. Currently he studies Computer Engineering, at the same time he works as a freelancer on both web programming and graphic design.","sameAs":["https:\/\/www.facebook.com\/fabiocimo","https:\/\/al.linkedin.com\/in\/fabiocimo","https:\/\/x.com\/fabiocimo","https:\/\/www.youtube.com\/fabiocimo1"],"url":"https:\/\/www.webcodegeeks.com\/author\/fabio-cimo\/"}]}},"_links":{"self":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/4900","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/users\/75"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/comments?post=4900"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/4900\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/917"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=4900"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=4900"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=4900"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}