Display long Title Menu in 2 lines

General questions relating to Joomla! 2.5. Note: All 1.6 and 1.7 releases have reached end of life and should be updated to 2.5. There are other boards for more specific help on Joomla! features and extensions.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting.
Forum Post Assistant - If you are serious about wanting help, you should use this tool to help you post.
Locked
dave-khuon
Joomla! Apprentice
Joomla! Apprentice
Posts: 5
Joined: Thu Nov 25, 2010 6:47 am

Display long Title Menu in 2 lines

Post by dave-khuon » Wed Jan 12, 2011 4:07 am

How can I display my top menu which has several menu items with LONG Title in multiple lines. I dont want the top menu items to be on multiple horizontal rows, as provided by Beez2 - Parks Site. ???

Thanks in advance.
dk

User avatar
DeanMarshall
Joomla! Hero
Joomla! Hero
Posts: 2352
Joined: Fri Aug 19, 2005 2:26 am
Location: Lancaster, Lancashire, United Kingdom
Contact:

Re: Display long Title Menu in 2 lines

Post by DeanMarshall » Wed Jan 12, 2011 10:29 am

As a general rule - you would set a fixed width for the menu items, remove any css that prevents whitespace from wrapping, and perhaps remove any limitations on line-height within the menu's css.

If you post a link to a development site with longer menu titles I could probably offer more specific help. Alternatively use Firefox with the Firebug extension and explore the html and css interactively.

Dean
Dean Marshall Consultancy - six Joomla experts - http://www.deanmarshall.co.uk/

Joomla Experts - Joomla Support http://www.deanmarshall.co.uk/joomla-se ... pport.html

dave-khuon
Joomla! Apprentice
Joomla! Apprentice
Posts: 5
Joined: Thu Nov 25, 2010 6:47 am

Re: Display long Title Menu in 2 lines

Post by dave-khuon » Wed Jan 12, 2011 2:00 pm

Thanks for your reply and your kind offer to look up my site. Unfortunately, it is local (localhost). I will look to move it to an internet site. Thanks.

deancj1
Joomla! Apprentice
Joomla! Apprentice
Posts: 22
Joined: Thu Nov 06, 2008 11:18 pm

Re: Display long Title Menu in 2 lines

Post by deancj1 » Thu Nov 15, 2012 12:47 am

The other way to do this is with css....

give the menu item a class name in the joomla backend.

then you can style it something like this

.two_line {
display:block;
width:80px;
text-align:center;
position:relative;
bottom:16px;
}

You could use absolute positioning if you wanted as well...

The bottom position is used to push the link up.....since the bottom part of the link will show below the other menu items instead of on the same line..... You may be able to control this with menu height but I didn't really look into it.

xdesigner
Joomla! Apprentice
Joomla! Apprentice
Posts: 5
Joined: Mon Apr 07, 2014 12:44 pm

Re: Display long Title Menu in 2 lines

Post by xdesigner » Mon Jul 28, 2014 5:38 pm

deancj1 wrote:The other way to do this is with css....

give the menu item a class name in the joomla backend.

then you can style it something like this

.two_line {
display:block;
width:80px;
text-align:center;
position:relative;
bottom:16px;
}

You could use absolute positioning if you wanted as well...

The bottom position is used to push the link up.....since the bottom part of the link will show below the other menu items instead of on the same line..... You may be able to control this with menu height but I didn't really look into it.
Worked for me. Thank you for this workaround.


Locked

Return to “General Questions/New to Joomla! 2.5”