homepage Welcome to WebmasterWorld Guest from 54.166.39.179
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Position LI Menu Background Image
techwiz



 
Msg#: 4432870 posted 3:59 am on Mar 24, 2012 (gmt 0)

First post here so I'll try and explain as indepth as possible.

Have been working with creating this online shop for a little while now and am not seeing the right code to use. The online shop uses Wordpress v3.3.1 with Catalyst Theme v1.5 and Shopp Plugin v1.2. Now what I've done is create a categories menu / sub-menu to the left which I require each menu to have a background image (201px wide) behind it without the list style square. So what I need is for the image to move left more so it is centred within the sidebar. I hope there is a solution, cause my brain just quit. Thanks in advance.

[edited by: alt131 at 7:59 am (utc) on Mar 29, 2012]
[edit reason] Thread Tidy [/edit]

 

alt131

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4432870 posted 3:04 pm on May 4, 2012 (gmt 0)

Hi techwiz, and a very belated welcome to WebmasterWorld. If you are still working on this - and for any other readers, can you clarify whether the "side-bar" is the <li>, the <ul> or the menu container, such as a container div? The reason I ask is that I am womdering if the issue is more complex than the suggestions I've made below.

If the list itself, there are a number of ways to visually "move" the background-image further to the left. The first is to remove the padding (or margin if supporting older versions) from the <ul> to remove the gap between the list marker and the list item that remains even when setting list-style-type:none is set. Another would be to apply a negative margin or position to the <ul> or <li> to forcibly drag it back towards the left. If the aim is to just move the background-image within the <li> then a negative background-position should do it.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved