{"id":1763,"date":"2011-09-16T07:03:55","date_gmt":"2011-09-16T14:03:55","guid":{"rendered":"https:\/\/bryanhadaway.com\/?p=1763"},"modified":"2025-05-22T15:23:15","modified_gmt":"2025-05-22T22:23:15","slug":"how-to-get-rid-of-rounded-corners-with-css3","status":"publish","type":"post","link":"https:\/\/webguy.io\/blog\/how-to-get-rid-of-rounded-corners-with-css3\/","title":{"rendered":"How to Get Rid of Rounded Corners with CSS3"},"content":{"rendered":"<p>I don&#8217;t know about you, but I feel the rounded corner fad in web design is dying out.<\/p>\n<p>Rounded corners will always have a place, but it&#8217;s with the introduction of <em>border-radius<\/em> in CSS3, that it got out of hand. I think the problem lies in the fact that what can make any design poor, is the lack of subtlety. It&#8217;s easy to overdo rounded corners to make a design look just plain goofy.<\/p>\n<p>If you have a theme you like, aside from the rounded corners or need to remove rounded corners from a project that would otherwise be an endless hunting down of classes and ids and testing specificity to kill them all, here&#8217;s the quick and dirty way with CSS3 to wipe them out completely in one shot:<\/p>\n<pre><code>*{border-radius:0 !important}<\/code><\/pre>\n<p>(<em><strong>*<\/strong> is a wildcard that essentially means everything, all divs, paragraphs, classes, ids, etc.<\/em>)<\/p>\n<p>Not at all an elegant solution, but drop that in your stylesheet and we&#8217;ll have our glorious, timeless, classic, never out-of-style, ninety-degree, wonders of symmetrical goodness corners right back where they should be.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I don&#8217;t know about you, but I feel the rounded corner fad in web design is dying out. Rounded corners will always have a place, but it&#8217;s with the introduction of border-radius in CSS3, that it got out of hand. I think the problem lies in the fact that what can make any design poor, <a href=\"https:\/\/webguy.io\/blog\/how-to-get-rid-of-rounded-corners-with-css3\/\" class=\"more-link\">&#8230;<span class=\"screen-reader-text\">  How to Get Rid of Rounded Corners with CSS3<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17,5],"tags":[254,278,218,206],"class_list":["post-1763","post","type-post","status-publish","format-standard","hentry","category-how-to","category-web-design","tag-css","tag-css3","tag-how-to","tag-web-design"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/posts\/1763","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/comments?post=1763"}],"version-history":[{"count":0,"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/posts\/1763\/revisions"}],"wp:attachment":[{"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/media?parent=1763"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/categories?post=1763"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webguy.io\/blog\/wp-json\/wp\/v2\/tags?post=1763"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}