Avatar for Username

Sykje yn Support

Mij stipescams. Wy sille jo nea freegje in telefoannûmer te beljen, der in sms nei ta te stjoeren of persoanlike gegevens te dielen. Meld fertochte aktiviteit mei de opsje ‘Misbrûk melde’.

Learn More

Dizze konversaasje is argivearre. Stel in nije fraach as jo help nedich hawwe.

how to add color to back and forward buttons?

  • 2 antwurd
  • 1 hat dit probleem
  • 7 werjeftes
  • Lêste antwurd fan cor-el

genestoy
genestoy
more options

I am using the css below to make the back and forward buttons larger but I would like to color them "blue", what do I need to add to this css to do that? Thanks 

#main-window:not(#f) #back-button {
  list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAjUlEQVR42uWXwQrAIAxD9f8/OttlIDK2mkYrVvCYl3cQtbX4Fu5dPQBPGAIGHYaAQYchYNBhCBh0GAIGHYaAQYchYNDhv/KpApbyaQLW8ikCI+Xu1QssLe8Flpe3AiHlj0BY+TYCJVJim0MYJrHdRcRInPkYjUic/SGxSOT4lH5J5BpM3iRyDqethItxAaTNIBfhl7xRAAAAAElFTkSuQmCC") !important;
}

#main-window:not(#f) #forward-button {
  list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAkElEQVR42sWXSw7AIAhEy/0P3ZoumtRoKyPwSFy4YObFL9ixH2cbpibLiR2ArBUJIOlFA7g1MwBculkAy9qZAEv62QC/HhUAnz5VAFOvSoChnzkFIsL6STXAC4ICeCBIgNufBsBXAAdAtwA9hOg1tOlEjO2nuAoA/YzQ7xgtSNCSDC1K0bIcbUzQ1gxtTmWdCyMiIB+7tLLnAAAAAElFTkSuQmCC") !important;
}
I am using the css below to make the back and forward buttons larger but I would like to color them "blue", what do I need to add to this css to do that? Thanks <pre><nowiki>#main-window:not(#f) #back-button { list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAjUlEQVR42uWXwQrAIAxD9f8/OttlIDK2mkYrVvCYl3cQtbX4Fu5dPQBPGAIGHYaAQYchYNBhCBh0GAIGHYaAQYchYNDhv/KpApbyaQLW8ikCI+Xu1QssLe8Flpe3AiHlj0BY+TYCJVJim0MYJrHdRcRInPkYjUic/SGxSOT4lH5J5BpM3iRyDqethItxAaTNIBfhl7xRAAAAAElFTkSuQmCC") !important; } #main-window:not(#f) #forward-button { list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAkElEQVR42sWXSw7AIAhEy/0P3ZoumtRoKyPwSFy4YObFL9ixH2cbpibLiR2ArBUJIOlFA7g1MwBculkAy9qZAEv62QC/HhUAnz5VAFOvSoChnzkFIsL6STXAC4ICeCBIgNufBsBXAAdAtwA9hOg1tOlEjO2nuAoA/YzQ7xgtSNCSDC1K0bIcbUzQ1gxtTmWdCyMiIB+7tLLnAAAAAElFTkSuQmCC") !important; }</nowiki></pre>

Bewurke troch cor-el op

Alle antwurden (2)

WestEnd
WestEnd
more options

I would think someone probably probably has done something like that online and has a css that you could copy from and adjust to what your asking the css to do.

Bewurke troch WestEnd op

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Those are images in base64 format (data URI). You can open these images in a Firefox tab and save them and open them in an image editing application. There you can color the images and re-save them.

You can open the edited image in a Firefox tab and use the Inspector to convert the image to a data URL.

  • right-click the image in the left pane -> Copy -> Image Data-URL

This places the image data on the clipboard, so you can paste it in the CSS code.

Bewurke troch cor-el op