CSS Hide outer Span and show inner span

Question

as low as $1,33         


        

Answer 1

The best solution is to change the HTML, as in 4castle's answer.

However, if for whatever reason you cannot change the HTML structure, but you can change the text content and the CSS, and also have a way to set the class on an object as needed (I used a hacky little piece of JS to toggle, but it could also be set during generation of a static page), you can use the ::before pseudoelement to display the desired text:

function handleClick(what) {
  what.classList.contains('asLowAs') ? what.classList.remove('asLowAs') : what.classList.add('asLowAs');
}

.asLowAs::before {
  content: "as low as ";
}

  
    $
    1,335.79