Archived

This topic is now archived and is closed to further replies.

  • 0

Resolved List Style Items In Widget Area Do Not Show


Question

Posted · Report post

Hi!

I would like to use images as list style items in a widget area.

I use Pagelines Framework 2.3.3 and a child theme.

In my style.css I put:

.widget ul li {

display: block;

font-size: 0.8em;

padding-bottom: 0;

padding-left: 2px;

padding-right:2px;

padding-top: 0px;

list-style: square inside url( li_button.jpg);

}

This is the website: www.armadix.nl/wordpress

Share this post


Link to post
Share on other sites

10 answers to this question

Posted · Report post

Hi

Please try with

#text-2 {background-image: url("http://YOUR IMAGE.gif");}

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Bat!

Thanks for your answer, but I'm not looking for another background image, I would like to have a bulleted list.

Share this post


Link to post
Share on other sites

Posted · Report post

Upps I understand now

You can try change for


.widget ul li {

display: block;

font-size: 0.8em;

padding-bottom: 0;

padding-left: 2px;

padding-right:2px;

padding-top: 0px;

list-style-type: square inside url([url="http://Your image]);

}


Share this post


Link to post
Share on other sites

Posted · Report post

mmm, thanks, I tried but no luck.

Thanks anyway!

You would aready help me if I could just put dots or squares in....

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there, so you're looking to add images into the list before the text? So it appears as a bulleted list but using your own images to provide the bullets? Please clarify is this is what you mean and we'll look into a solution

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Hi James,

I would like to make a bulleted list.

And, if possible, with my own images, but at this point I would already be happy with 'standard squares'.

Thank you

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

The first thing you will need to do is add this to your custom CSS:

.widget ul { display: list-item; }[/CODE]

Then I recommend you go to this page and learn how to set the CSS to add your images to your lists.

http://www.w3schools...ist-style-image

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Hi again

With Danny´s instruction in this and other forum topic (with Danny´s instruction too) I believe that I find the solution

I try with


.widget ul li { list-style-image: url(http://www.armadix.nl/wordpress/wp-content/uploads/2012/10/li_button.jpg);

display: list-item;

margin: 0.7em 0 0.7em 0.7em;

padding: 0 5px; }

I insert in one text widget

<ul>

<li>Coffee</li>

<li>Tea</li>

<li>Coca Cola</li>

</ul>

And you have the image

Captura%2520de%2520pantalla%25202012-10-24%2520a%2520las%252006.58.51.jpg

:)

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Thank you Danny and THANK YOU Batman!!!

It works!

Topic can be closed....

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites