{"id":984,"date":"2018-02-23T11:53:32","date_gmt":"2018-02-23T11:53:32","guid":{"rendered":"https:\/\/greladesign.co\/blog\/?p=984"},"modified":"2018-02-24T00:03:16","modified_gmt":"2018-02-24T00:03:16","slug":"css-tip-avatar-circle-made-with-css","status":"publish","type":"post","link":"https:\/\/greladesign.co\/blog\/2018\/02\/23\/css-tip-avatar-circle-made-with-css\/","title":{"rendered":"CSS Tip: Avatar circle made with CSS"},"content":{"rendered":"<p><a href=\"https:\/\/caniuse.com\/#feat=border-radius\" rel=\"noopener\" target=\"_blank\">Can I Use &#8216;border-radius&#8217;<\/a><\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\n&lt;img class='avatar circle' src='image.jpg' \/&gt;\r\n<\/pre>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\n\r\n.circle {\r\n    border-radius: 50%;\r\n}\r\n\r\n<\/pre>\n<p class='codepen'  data-height='265' data-theme-id='0' data-slug-hash='jZpZar' data-default-tab='result' data-animations='run' data-editable='' data-embed-version='2'>\nSee the Pen <a href='https:\/\/codepen.io\/LukaszGrela\/pen\/jZpZar\/'>circle avatar with CSS<\/a> by Lukasz Grela (<a href='https:\/\/codepen.io\/LukaszGrela'>@LukaszGrela<\/a>) on <a href='https:\/\/codepen.io'>CodePen<\/a>.0<\/p>\n<script async src=\"https:\/\/cpwebassets.codepen.io\/assets\/embed\/ei.js\"><\/script>\n","protected":false},"excerpt":{"rendered":"<p>Can I Use &#8216;border-radius&#8217;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":""},"categories":[123,138],"tags":[338,124],"_links":{"self":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts\/984"}],"collection":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/comments?post=984"}],"version-history":[{"count":7,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts\/984\/revisions"}],"predecessor-version":[{"id":998,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/posts\/984\/revisions\/998"}],"wp:attachment":[{"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/media?parent=984"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/categories?post=984"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/greladesign.co\/blog\/wp-json\/wp\/v2\/tags?post=984"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}