Jump to content
TNG Community
fluffy82

Menu customization

Recommended Posts

fluffy82

I have a silly question, to which there is probably a very simple answer, but I just can't seem to find the solution.

In my WordPress site, whenever I need to use tabs, they are vertical. I wanted to try to get the tabs on the getperson page also vertically (only the main "menu": person, family, ancestors,...). I am not using the TNG tab css anyway, I customized it, and my experience is that none of the tabs actually use full width - except the map - so making the area less wide and have a column on the left shouldn't be a problem.

Now, getting the tabs themselves show vertically on the left is not a problem. If I set the width of #tngmenu to 15% in stead of 100%, float: left and display: grid, that does the trick.
But the actual content of the tabs (#getperson) still remains under the menu, in stead of next to it. I did try to change the width to 85% (also tried 75% to see if that makes a difference and to avoid unwanted padding or margin issues), I played around with the display settings, with the floating, but nothing helps.

Does anyone have a wonder formula to make the #tngmenu and #getperson divs to show next to each other in stead of one below the other? Without messing up the content of the divs, of course.

Thanks!
Tom

Share this post


Link to post
Share on other sites
cfj

Maybe not what you are after, but I have made  the person menu, to a select menu with family, ancestors etc.  Works on smaller devices : @media (max-width: 960px)

 

 

Share this post


Link to post
Share on other sites
fluffy82
16 minutes ago, cfj said:

Maybe not what you are after, but I have made  the person menu, to a select menu with family, ancestors etc.  Works on smaller devices : @media (max-width: 960px)

 

 

No, not really what I'm after. I want to keep the content of the page as is (I have a ton of mods to expand that information rather than condensing it). I just want it to show next to the tabs, not underneath...

Share this post


Link to post
Share on other sites
fluffy82

I think I'll have to give up or at least postpone... It would work if I could manage to wrap the menu into 1 div, and the submenu and content in one or two other divs. As each tab seems to be a different .php page, I'm not sure how to manage that without modifying 15000 things...

Share this post


Link to post
Share on other sites
fluffy82

I'm happy to say that I finally (kind of) succeeded in getting the tabs to show vertically. It still needs some tweaking for all sub-pages, and the visualisation is not yet what it should be, but yay for the most important part of the process :)

example

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×