Strikethrough line – Regular Price

  • Resolved pickme

    (@pickme)


    5 years, 9 months ago

    Hi,

    I removed the default horizontal strikethrough line from the old/regular price with property text-decoration: none;, but I want to style that line as seen here (Style 1): https://codepen.io/jasper/pen/xEJPgk

    I tried with the CSS code show below to style and make the line/’border line’ inclined, but I did not succeed. Could you please help?

    body .price del {
text-decoration: none;
 &:before {
      content: " ";
      display: block;
      width: 100%;
      border-top: 2px solid rgba(red, 0.8);
      height: 12px;
      position: absolute;
      bottom: 0;
      left: 0;
      transform: rotate(-7deg);
    }
  }

    The theme developer advised me to contact WooCommerce support.

    Thank you

    • This topic was modified 5 years, 9 months ago by pickme.
    • This topic was modified 5 years, 9 months ago by pickme.
Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Riaan K.

    (@riaanknoetze)

    5 years, 9 months ago

    Hi there,

    It’s likely that the underlying markup for your site is different than what’s used on in that codepen. To take a closer look, can you share a direct link to the product you’re using to test that custom CSS on?

    Thread Starter pickme

    (@pickme)

    5 years, 9 months ago

    Hi @riaanknoetze,

    I would like to send the URL privately. How can I send it to you please?

    Thank you

    Plugin Support slash1andy

    (@slash1andy)

    Automattic Happiness Engineer

    5 years, 9 months ago

    Hey there!

    There’s not really a way to send a URL privately in the forums here. You can paste it here so that we can look at this closer.

    Thread Starter pickme

    (@pickme)

    5 years, 9 months ago

    Hello @slash1andy and @riaanknoetze,

    I implemented this working CSS solution. I am sharing it for the community.

    background: linear-gradient(to left top, transparent 47.75%, currentColor 49.5%, currentColor 50.5%, transparent 52.25%);
text-decoration: none;
color: red!important;

    Regards

    • This reply was modified 5 years, 9 months ago by pickme.
    • This reply was modified 5 years, 9 months ago by pickme.
Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Strikethrough line – Regular Price’ is closed to new replies.