How to remove the list style on my footer menu WordPress

• SOLVED

Hello I have a list style defined in my stylesheet as...

li {
background:url(images/li.png) no-repeat;
padding:0 0 0 12px;
}

However it also shows on my footer menu, how can I stop the footer menu li's picking up this class?

The URL for my site is in the attached image if you need to see what.

Thank You

:)


EDIT: Here is how I am calling the menu's in the footer.php

<div id="footertop">
<div id="footertopinner">
<div class="footer1">
<div class="footerheader">Home</div>
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer1' ) ); ?></div>
<div class="footer2">
<div class="footerheader">Services</div>
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer2' ) ); ?></div>
<div class="footer3">
<div class="footerheader">Sectors</div>
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer3' ) ); ?></div>
<div class="footer4">
<div class="footerheader">Key People</div>
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer4' ) ); ?></div>
<div class="footer5">
<div class="footerheader">Careers</div>
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer5' ) ); ?></div>
<div class="footer6">
<div class="footerheader">Information</div>
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'footer6' ) ); ?></div>
</div>
</div>



2ND EDIT: This is in my functions.php, does this mean anything for the footer menu?

function light_and_modern_page_menu() {
echo '<ul class="menu">';
$links = get_pages();

foreach($links as $i => $page)
$links[$i] = '<li class="page-' . (is_page($page->ID) ? 'active' : 'item') . '"><a href="' . get_page_link($page->ID) . '" title="' . esc_attr(apply_filters('the_title', $page->post_title)) . '">' . apply_filters('the_title', $page->post_title) . '</a> � // �</li>';

echo implode('', $links);
echo '</ul>';
}

Answers (4)

2012-09-12

Michael Caputo answers:

Id need to see the code of your footer, or your header, but it would be something like this:

#footer li{background:none;padding:0 0 0 10px;}


---

Ross Gosling comments:

Hi Michael, please see edit to question.... Thank you

---

Michael Caputo comments:


#footertopinner li{background:none;padding:0 0 0 10px;}


---

Ross Gosling comments:

Thank you for the quick reply, however this did not work when added to the stylesheet.

---

Michael Caputo comments:

try

#footertopinner ul li{background:none;padding:0 0 0 10px;}


Otherwise, you may have some cascading styles effecting the list items. I prefer not to use !important on CSS as I find it can cause other problems down the road, it's a lazy fix IMO.

---

Ross Gosling comments:

Thank you, but this didn't work.

---

Michael Caputo comments:


#footer1 ul.menu li,
#footer2 ul.menu li,
#footer3 ul.menu li,
#footer4 ul.menu li,
#footer5 ul.menu li,
#footer6 ul.menu li{background:none;padding:0 0 5px;}


---

Ross Gosling comments:

Great working thank you!!

2012-09-12

Pavel Petrov answers:

@Michael Caputo said it all :) in your case #footertopinner li{background:none;padding:0 0 0 10px;}
Kudos for beating me to it :D

2012-09-12

Dbranes answers:

try to add this into your style.css

#footertop li {
background:none !important;
padding:2px 2px 2px 5px !important;
}


and you can change the above padding to your likings.

hope this helps.

2012-09-12

Pali Madra answers:

In line the 36 of style.css the following code is there

li {
background:url("images/li.png") no-repeat scroll 0 0 transparent;
padding:0 0 0 12px;
}

please change this to

li {
padding:0 0 0 12px;
}

This should fix it.