Just wondering how I would add space between the upper navigation border and the upper (black) bar of my site. In my case, I would like for the logo, menu, search, etc to remain as they are - I would just like some more white space (between the upper navigation border and lower border of upper black bar). Ultimately, I do want the logo to be so close to the upper black bar.
At this time, I am not able to provide a screenshot, but if you look at curlyafrodotcom you will see with your code, the upper margin of logo (namely, C l A f) almost touches the lower border of black bar. I would like the reverse with the logo (namely, y and f) almost touching the lower border of navigation bar with space between the upper margin of logo (namely C,l A f) and the lower border of black bar. . With my code I get the intended changes, but not sure if the best code to have?
Is it possible to increase the space (between the C, l, f and the lower border of black bar) while also keeping the highlighted/active menu item (red) resting on navigation line (black)? When I try and increase the values, the red line shifts upwards instead of remaining on the black line.
I am not sure what you are referring as “C, l, f” and also it’s a bit hard for me to understand what you are trying to achieve so could you please share the screenshot like i have shared previously pointing to the exact space in it?
With reference to the C, l, A, f, I mean the letters in the logo. As indicated via attached screenshot, the upper borders of these letters are too close to the lower border of the black bar. I would like to be able to maintain everything else on as per screenshot, but increase the space between the upper borders of said letters and lower border of black bar.
You can increase the space between the upper borders of said letters and lower border of black bar by
changing the margin top value of the code provided in this reply as displayed below.
div#logo {
margin-top: 14px;
}
You can change the value 14px in the above code according to the space you want.
I implemented the above reply, but again, as per attached, the active menu item (underline) floats upwards instead of staying on the lower border of navigation menu. Also, the other menu items and search box also float upwards - throwing the vertical symmetry of the menu and search box in relation to the logo. Is there a way to remedy this?
If the above solution doesn’t help you then please share the screenshot making some basic wire frame changes in it to show me how you want it to display as i am not getting exactly what you are trying to achieve.