{"id":333,"date":"2025-12-15T18:13:07","date_gmt":"2025-12-15T18:13:07","guid":{"rendered":"https:\/\/sccan.scot\/2020\/?p=333"},"modified":"2025-12-15T18:20:56","modified_gmt":"2025-12-15T18:20:56","slug":"style-my-links","status":"publish","type":"post","link":"https:\/\/sccan.scot\/2020\/2025\/12\/15\/style-my-links\/","title":{"rendered":"Style my links"},"content":{"rendered":"\n<p>I&#8217;d like an unusual css underline and hover to drop into my stylesheet for my woodland themed website side project, which uses twenty twenty wordpress. <\/p>\n\n\n\n<p>I want it only on the <a href=\"#\">paragraph links<\/a> \u2026 looking for a subtle underline and a chunkier slide-in hover like a marker, that covers the text and bit more.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p a {\n  position: relative;\n  text-decoration: none;\n  color: inherit;\n  background: none;\n}\n\np a::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  bottom: -0.15em;\n  height: 0.45em;              \/* chunkiness *\/\n  width: 75%;                  \/* only covers 3\/4 *\/\n  background: rgba(92, 122, 75, 0.35); \/* mossy green *\/\n  transform: scaleX(0);\n  transform-origin: left;\n  transition: transform 280ms ease-out;\n  z-index: -1;                 \/* sits behind text *\/\n  border-radius: 0.15em;\n}\n\np a:hover::after {\n  transform: scaleX(1);\n}\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;d like an unusual css underline and hover to drop into my stylesheet for my woodland themed website side project, which uses twenty twenty wordpress. I want it only on the paragraph links \u2026 looking for a subtle underline and a chunkier slide-in hover like a marker, that covers the text and bit more.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-333","post","type-post","status-publish","format-standard","hentry","category-updates"],"_links":{"self":[{"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/posts\/333","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/comments?post=333"}],"version-history":[{"count":3,"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/posts\/333\/revisions"}],"predecessor-version":[{"id":338,"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/posts\/333\/revisions\/338"}],"wp:attachment":[{"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/media?parent=333"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/categories?post=333"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sccan.scot\/2020\/wp-json\/wp\/v2\/tags?post=333"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}