Community @ The Turning Gate

Support community for TTG plugins and products.

NOTICE

The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.

This forum is now closed, and exists here as a read-only archive.

  • New user registrations are disabled.
  • Users cannot create new topics.
  • Users cannot reply to existing topics.

You are not logged in.

#1 2017-10-18 02:27:12

rsamco
Member
From: Bend, Oregon
Registered: 2012-12-20
Posts: 177
Website

adjusting horizontal navigation menu's height

I am trying to decrease the height of the band which holds BL's primary horiz. navigation menu. That is, decrease the padding above and below the actual menu items. The Designer does have the Navigation Horiz. Menu "Padding-top" and "Padding-bottom" controls for setting this padding's size but they are already set to 0 so I can't shrink them further. I experimented with different custom.css values for

.primary-menu {
     padding: 0px 0px 0px 0px;   
}

without any effect, up or down (even with an !important). My CSS skills aren't good enough to go further on my own. Any suggestions?


Rick

Offline

#2 2017-10-18 02:52:11

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 17,830
Website

Re: adjusting horizontal navigation menu's height

Looks like it's the line-height.

This is the default, try adjusting the line height as needed:

nav.nav .menu-item, nav.nav .menu-item a, nav.nav .menu-item span {
  line-height: 36px;
}

Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site

Offline

#3 2017-10-18 03:05:08

rsamco
Member
From: Bend, Oregon
Registered: 2012-12-20
Posts: 177
Website

Re: adjusting horizontal navigation menu's height

That did it, Rod ... thanks!


Rick

Offline

#4 2017-10-18 11:12:15

Matthew
Administrator
From: San Francisco, CA
Registered: 2012-09-24
Posts: 5,795
Website

Re: adjusting horizontal navigation menu's height

Just be mindful of design and usability principles in making such edits. The recommended button size for touch-screens tends to be around 44px, ensuring that buttons can be pressed without accidentally triggering adjacent elements by users of varying finger sizes. For Backlight, I lean hard into multiples of 12, so our UI elements tend toward 48px.


Matt

The Turning Gate, http://theturninggate.net

Offline

#5 2017-10-18 11:59:24

rsamco
Member
From: Bend, Oregon
Registered: 2012-12-20
Posts: 177
Website

Re: adjusting horizontal navigation menu's height

Great point of view, Matt...thanks!!!


Rick

Offline

Board footer

Powered by FluxBB