wrapping long navigation bars

[cajchris]

hi,

I am wondering if any1 knows how to wrap the contents of a horizontal navigation bar if there are many links on it, so that it looks neater

regards
chris

 

[BillyRayPreachersSon]

Do you want to know how from a technical / programming perspective, or how from a design / aesthetic perspective?

If the latter, you'd probably want to ask in the Web Site Designers forum.

Hope this helps,
Dan


[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[cajchris]

the former. I want to know how to actually implement this feature.

regards
chris

 

[BillyRayPreachersSon]

OK - so saying "so that it looks neater" isn't telling us what you want to happen. Can you tell us what you actually want to happen - how you want them to wrap, etc?

Dan


[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[BillyRayPreachersSon]

And also showing us the code you've got so far would also be handy.. or giving a URL to it.

Hope this helps,
Dan


[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[cajchris]

well i am using a package called infoglue to create this website so im not sure if you are familiar with it but here is the code that is creating the navigation bar:

<div id="Nav1">
<span class="Nav1Text">
<table border = "0" align="$templateLogic.componentLogic.getPropertyValue("alignment")">
<tr>
<td>
#foreach($webpage in $templateLogic.getComponentLogic().getBoundPages("pages"))
<a href="$webpage.url" class="Nav1TextLink">$webpage.navigationTitle</a>
#end
</td>
</tr>
</table>

basically it is a table, with a single row and the #foreach part is simply iterating through the directories added to the navigation list. which then places the title as a link within a <td> tag. what i want is for a link to wrap to the next line if it it runs over. so that i dont have links going over 2 lines.

regards,
chris

 

[ChrisHunt]

If you don't want individual links to be split across lines, put this in your stylesheet:

#Nav1 a { white-space: nowrap }

Btw, what's the span and the single-cell table for? You should be able to do all you need with just the <div>.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[cajchris]

its ok i have removed the table part. however now the remaining two links have been cut off at the edge of the browser window. I want them to appear on the next line, within the navigation bar which is a background image.

regards
chris