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

timeout - Handshake_timeout on RabbitMQ using python and pika from remote vm -

gcc - MinGW's ld cannot perform PE operations on non PE output file -

c# - Search and Add Comment with OpenXML for Word -