html - Change button-text based on viewport width -


i've got button close lightbox in homepage.

it's text says 'close' , is-right-aligned. can overlap headline-text when viewport width lower 400 pixels.

so want exchange 'x' using media-queries.

i tried .button:before works can't rid of original 'close' text way.

how can achieve css?

set value of button using pseudo-element :before default value "close". here's example:

html

<span class="button" title="close"></span> 

css

.button:before {     content: 'close'; }  @media screen , (max-width: 200px) {     .button:before {         content: 'x';     } } 

demo

try before buy


Comments

Popular posts from this blog

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

twig - Using Twigbridge in a Laravel 5.1 Package -

c# - LINQ join Entities from HashSet's, Join vs Dictionary vs HashSet performance -