Zikula Community

• manarak
  
  

  • Rank: Helper
  • Registered: Dec 31, 1969
  • Last visit: May 20, 2010
  • Posts: 524

  Posted: May 24, 2009 - 08:56 PM

  ok, I got the problem that the content of the menu block just comes like all the other block contents with
  

  Code

  <!--[$content]-->

  
  
  Apparently, ul and li are built into the block's code.
  
  Now, I would like to apply a style (like custom bullets, for example) to one particular block, let's call it "Main Menu", but I don't want that style to swap over to other blocks of the same type or to other lists used on the website.
  
  I use a Xanthia theme.
  
  How should I proceed?
  
  
  
  edited by: manarak, May 24, 2009 - 08:57 PM

  • 
  •  
• craigh
  
  

  • Rank: Developer
  • Registered: Jun 16, 2003
  • Last visit: May 29, 2010
  • Posts: 1966

  Posted: May 25, 2009 - 12:19 AM

  create a template for that block and assign it to the block ID in the config file. In the block template, wrap the context of the block in a div with an ID. Then in your stylesheet, use stuff like
  

  Code

  #myblockstyle ul {
    /* do something */
  }
  #myblockstyle li {
    /* do something else */
  }

  
  
  
  
  edited by: craigh, May 25, 2009 - 07:20 AM

  • 
  •  
• manarak
  
  

  • Rank: Helper
  • Registered: Dec 31, 1969
  • Last visit: May 20, 2010
  • Posts: 524

  Posted: May 26, 2009 - 12:30 AM

  Thank you again Craigh - that did the trick.
  
  Now another problem appeared on IE 7:
  A bullet point appears before the empty line in the main menu (default menu).
  In Firefox, no disturbing bullet point appears!

  • 
  •  
• craigh
  
  

  • Rank: Developer
  • Registered: Jun 16, 2003
  • Last visit: May 29, 2010
  • Posts: 1966

  Posted: May 26, 2009 - 12:58 AM

  does your styling include
  

  Code

  list-style:none;

  
  ?
  
  resources:
  http://css.maxdesign.com.au/listamatic/
  http://www.w3.org/TR/CSS21/generate.html#list-style

  • 
  •  
• manarak
  
  

  • Rank: Helper
  • Registered: Dec 31, 1969
  • Last visit: May 20, 2010
  • Posts: 524

  Posted: May 26, 2009 - 02:18 AM

  I didn't include list-style:none
  
  I added it, so now I got:
  

  Code

  //mainmenu style
  #mainmenu ul {
  list-style-image: url("/themes/pnDefault/images arrow.gif");
  list-style: none;
  font-weight: bold;
  margin-top:10px;
  margin-bottom:10px;
  }

  
  
  but I must be doing something wrong, because still no joy in IE.
  
  P.S. couldn't find any hints to my problem in the 2 list resources you posted, except that list-style:none resets the bullet img and bg to none.
  
  
  
  edited by: manarak, May 26, 2009 - 02:26 AM

  • 
  •  
• manarak
  
  

  • Rank: Helper
  • Registered: Dec 31, 1969
  • Last visit: May 20, 2010
  • Posts: 524

  Posted: May 26, 2009 - 02:49 AM

  well, it is rather strange, because I can find the following in the HTML source, applied to the empty li pair:
  

  Code

  <li ></li>

  
  
  yet in IE, a bullet point appears?
  
  P.S. I hate that this board keeps sabotaging my posts, it is almost impossible to post code, except very simple ones.
  
  In the above code, please imagine that there is an inline style for the li tag with list-type:none in it.
  
  To mess with posted code is a very poor behavior for a board used by webmasters and developers! grr.
  
  
  
  edited by: manarak, May 26, 2009 - 02:55 AM

  • 
  •  
• manarak
  
  

  • Rank: Helper
  • Registered: Dec 31, 1969
  • Last visit: May 20, 2010
  • Posts: 524

  Posted: May 26, 2009 - 03:09 AM

  GRR..
  apparently it is a IE7 bug, resolved in IE8.

  • 
  •  
•  
•  

Users on-line

• 0 users

This list is based on users active over the last 60 minutes.