Styling a List

[millsy007]

I am having real trouble styling my list, no matter what combo of css tags I use I cant seem to get it to display how I want!

I want my list to display horizontally and to have no bullet points.

 

.clearfix {display: inline-block;}
#new_prod_wrap li {list-style:none}

 

<ul class="new_prods_wrap clearfix">
<li class='new_prod_wrap first' style='width:180px'>
<a href='' rel=><img src=''/></a>							
<div class="teaser">
<h5 class="prod-title"><a href="">Poole Pottery Plate</a>
</h5><p class="price_value"><span class="price solo">£95.00</span></p><!-- price_value -->
</div>
</li>
</ul>

 

Thanks for any pointers on where I am going wrong

[cssfreakie]

a few things.

 

use display:inline;

 

second.

 

Your assigning properties to an #id in your style sheet while you meant a class

so change # with a dot (.classname) (ie. .new_prod_wrap )

 

I would also recommend to remove all your inline style. just place all style in an external stylesheet. It's much cleaner and more efficient.

[millsy007]

Hi

 

I removed the clearfix part set list to inline and changed it to be a class, so just have:

(i have a stylesheet but just showing relevant bits)

 

.new_prod_wrap li {display: inline;
list-style-type: none;
padding-right: 20px;}

 

<ul class="new_prods_wrap">
<li class='new_prod_wrap first' style='width:180px'>
<a href='' rel=><img src=''/></a>							
<div class="teaser">
<h5 class="prod-title"><a href="">Poole Pottery Plate</a>
</h5><p class="price_value"><span class="price solo">£95.00</span></p><!-- price_value -->
</div>
</li>
</ul>

 

It is still formatted the same?

[cssfreakie]

It is still formatted the same?

you have a question mark, after your statement. I think you want to say it's not working and it still looks the same right?

 

DO you have an on-line example of this it might very well be that some other things are interfering?