[Typo3] break up horizontal menu line in to many lines

Christopher bedlamhotel at gmail.com
Thu Oct 6 18:12:33 CEST 2005


Hi,

> Henrik Andersen - OctoVision I/S wrote:
> > Hi all
> >
> > I have a problem with af horizontal menu that is to wide for the page design. Because of that i would like to be able to brake the "line" at a certain point and make the rest of the menu items appear on the next line.
> >
> > I have not been able to figure out how to do this. Any help would be appreciated :-)
> >
> > This is my ts code:
> >
> > # Top Navigation
> > subparts.TOPNAV2 = HMENU
> > subparts.TOPNAV2.entryLevel = 1
> > subparts.TOPNAV2.1 = TMENU
> > subparts.TOPNAV2.1 {
> >
> > wrap = <table border="0" cellspacing="0" cellpadding="0"><tr> | </tr></table>
> >   NO.allWrap = <td class="td_level2"> | </td>
> >   NO.stdWrap.htmlSpecialChars = 1
> > #     Enable active state and set properties:
> >   ACT = 1
> >   ACT.stdWrap.htmlSpecialChars = 1
> >   ACT.allWrap = <td class="td_level2_act"> | </td>
> >
> > }

Provided a couple of conditions can be met, you can almost certainly
achieve this kind of layout by using CSS and not really involving
Typo3 very much at all. Try this (extremely basic!) example in a
browser:

<ul style="width:400px;float:left;list-style-type:none;">
  <li style="width:100px;float:left;"><a href="#"
style="display:block;background:#efefef;margin:1px;">Lorem</a></li>
  <li style="width:100px;float:left;"><a href="#"
style="display:block;background:#efefef;margin:1px;">Ipsum</a></li>
  <li style="width:100px;float:left;"><a href="#"
style="display:block;background:#efefef;margin:1px;">Dolor</a></li>
  <li style="width:100px;float:left;"><a href="#"
style="display:block;background:#efefef;margin:1px;">Sit</a></li>
  <li style="width:100px;float:left;"><a href="#"
style="display:block;background:#efefef;margin:1px;">Amet</a></li>
</ul>

( though you should of course move the styles to an external stylesheet :-) )

-Christopher



More information about the TYPO3-english mailing list