Round corner text box gradient colour

  • 1
  • Question
  • Updated 6 years ago
  • Answered
Is it possible to apply a background gradient to a round corner text box code?
Photo of Chris


  • 33 Posts
  • 0 Reply Likes

Posted 6 years ago

  • 1
Photo of David


  • 465 Posts
  • 94 Reply Likes
Hi Chris
First you need to create your gradient image here and upload it to your file manager. Then insert the code below, without the <!-- and --> into a text widget by clicking in the widget and selecting HTML on the toolbar, delete any code already present.

<div style="background-image:url(resources/your gradient image.jpg); border:solid 5px #000000; width:100%; height:100%; border-radius:10px; padding:5px">Your text here</div>

Change the gradient image name to yours and alter the px and # values to suit, let me know if you need any more assistance
Photo of Brianna


  • 2045 Posts
  • 92 Reply Likes
Thanks for the help, David! Much appreciated :)