-
Posts
-
I have .main_menu a tags shrinking from 88px to 37px using the settings: Slim, Shrinking header.
I’ve update avia.js to divide by 1.5 as opposed to 2 to increase the area, then I forced a minimum height on the css to force the logo and container to only shrink to the height dictated by the math in the js (a little less than 59px).
Unfortunately the the line-height of the menu items allows them to shrink smaller than 59px (37px mentioned above) and then snap back to 59px once the scrolling action has taken it’s course. Do you know why this line-height is not adhering to the 1.5 division? I was going to look into removing the line-height and specifying a padding to keep the elements centered.
I’ve added a link to the site where this behavior is occurring.
Thank you for your consideration.
Hey aaronlevy1!
Line height is added as an inline style via js so it’s specificity is the highest and cannot be altered using CSS
style="height: 51.7647px; line-height: 51.7647px; min-height: 58.6667px;"You can change it’s height in Enfold > header options
Cheers!
Vinay KashyapRight, but how do I edit the JS to not allow the height and line-height to drop below a certain point?
If you visit the link provided you will see the shrinking behavior, then at a certain point it all jumps to fit the min-height set, except for the logo where the behavior is accurate. The main menu, however, slides up slightly as it’s container shrinks then snaps to position.
By setting 1.5 within the avia js script for newH, the math comes out to 58.6667px, so I’m not certain why the line-height and height insist on shrinking down to 37px.
Talk soon,
AaronHi!
it would require a huge amount of time and customization of the theme and that is why you would need to hire a freelance developer for this job.
Regards,
Andy
- The topic ‘Main Menu shrink too far do to line-height’ is closed to new replies.