Bullet shading

  • 1
  • Question
  • Updated 6 years ago
  • Answered
I'm trying to put shading behind my indented bullets. I only want it on page though. what's the html code for this? thanks
Photo of matt

matt

  • 8 Posts
  • 0 Reply Likes

Posted 6 years ago

  • 1
Photo of Crystal

Crystal, Champion

  • 250 Posts
  • 79 Reply Likes
Hello Matt,

By shading, to you mean that some of the bullet points are an empty circle and on some of them you want the circle to be filled in?
Photo of matt

matt

  • 8 Posts
  • 0 Reply Likes
They are all bulleted lists with solid circles. I was able to change the typical black bullet into white to match text but can't match the bullet to the text shading.
Photo of Crystal

Crystal, Champion

  • 250 Posts
  • 79 Reply Likes
Hello Matt,

One idea that may work is creating an image of what you want the bullet to look like and uploading the image to Site > File Manager in Yola. Then to use the image as a bullet the code would be as follows. Replace the XXXX's with the file name of the uploaded image.


<li style="list-style-image: url(resources/XXXX.jpg)">list item </li>
Photo of matt

matt

  • 8 Posts
  • 0 Reply Likes
Hey Crystal,

I tried that but couldn't get a good pic that wasn't hazy & I won't be able to hit the bullet list to a bullet any time I need one on the page. It would be more work to insert each time.

I was able to change the size & color of the bullet by adding this...

li {
color: white;
font-size: 20px;
text-shadow:5px 5px 11px #000000;

this also have me the text shadowing I needed for just that page. I did this in the text widget's html
Photo of Crystal

Crystal, Champion

  • 250 Posts
  • 79 Reply Likes
Hello Matt,

To change the css for the new style of bullet would require making a sub class such as:

li.style2 {
list-style-image: url(resources/XXXX.jpg);
}


Then in the html widget to call the new class:

<li class="style2"> list name </li>
Photo of matt

matt

  • 8 Posts
  • 0 Reply Likes
thanks Crystal that fixed it.

Matt