Viewing How to make a dropdownmenu having the same height as the navigationbar?
How to make a dropdownmenu having the same height as the navigationbar?
|
User: Raf P. 9 years ago
|
|
|
Hi, how can I make a dropdownmenu having the same height as the navigationbar? In part 3 of the video tutorial navigationbar, the dropdown has the same height as the navigationbar, but they don't show how to do this. I have a nav-bar with a height of 35px and a padding of 5, fontsize 13pt. The submenu's are less high. How can I give them the same height? Kind regards, Raf Last edit 9 years ago ------------------------------- Kind regards, Raphael Pairoux |
|
|
User: Roddy 9 years ago
|
|
|
See this page for how to modify the navigation… http://everwebcodebox.com/layout/navigation.html You can adjust the top and bottom padding of the drop down list item link to increase/decrease its height with this code… <style type="text/css"> #navmenu_menu0 ul ul li a, #navmenu_menu0 ul li.active li a, #navmenu_menu0 ul li:hover ul li a {padding:10px 0} </style> Change the value for top/bottom padding which, in the above example, is 10px. ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Raf P. 9 years ago
|
|
|
Thx Roddy! I suppose I must put this code in the Head Code Box of each page (the dropdown ones). Works nice. Is it also possible to center the text in it? It's always against the left border. Kind regards. Last edit 9 years ago ------------------------------- Kind regards, Raphael Pairoux |
|
|
User: Roddy 9 years ago
|
|
|
You would paste the code into the site wide Head Code box in the Site Publishing Settings page. To actually center the text you would add text-align:center to the code like this… <style type="text/css"> #navmenu_menu0 ul ul li a, #navmenu_menu0 ul li.active li a, #navmenu_menu0 ul li:hover ul li a {padding:10px 0; text-align:center} </style> It looks better if you keep the left edge of all the items in a straight line and just add some left padding like this… <style type="text/css"> #navmenu_menu0 ul ul li a, #navmenu_menu0 ul li.active li a, #navmenu_menu0 ul li:hover ul li a {padding:10px 0; padding-left:10px} </style> You can combine all the values for padding in the short form like this… <style type="text/css"> #navmenu_menu0 ul ul li a, #navmenu_menu0 ul li.active li a, #navmenu_menu0 ul li:hover ul li a {padding:10px 0 10px 20px} </style> The order is top-padding, right-padding, bottom-padding, left-padding. Last edit 9 years ago ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Raf P. 9 years ago
|
|
|
Perfect! Works great! Thx again Roddy! ------------------------------- Kind regards, Raphael Pairoux |
|
| Post Reply |
| You must login or signup to post. |