navigation styling

[design_agency]

hi there,

two questions:

#1
i’ve noticed that the color bar under the main navigation goes away on some pages. how can i keep it on all pages?

example with the bar
example missing the bar

#2
i’ve removed the padding around the logo so it hits the two horizontal bars, but when it resizes i get a lot of space below the logo. how can i prevent that space? (see attached)

thanks so much for your time,
emily

[Cosmin – SUPPORT]

Hi Emily,

1. That bar shows only if the page being viewed is also present in the menu.

2. Do you mean when you resize the browser window? If yes, at what width?

Regards,

————————————————————————————————————

Cosmin
Support Assistant

[design_agency]

hi cosmin,

1. i get that, however, even on rollover the effect goes away. it’s a fun element and it feels like something is missing when in some parts of the site the bar is there on rollover and on others its not. is there any way to correct this?

2. yes, when the browser is resized between about 750 and 1200px. you can see for yourself here, password is doodle.

thanks, emily

[Cosmin – SUPPORT]

Hey,

1. Unfortunately not, it will only be visible (no matter if hovering or not) in the case I mentioned above.

2. Try wrapping your CSS code for the logo padding, in a media query, so that it applies to all resolutions:

@media screen and (min-width: 320px) {

 /* your code for the logo padding here */

}

Regards,

————————————————————————————————————

Cosmin
Support Assistant

[design_agency]

hi cosmin,

not sure if i’m doing this right…

this is the code i’ve been using:

nav .menu li {
padding: 0px 0;
}

i tried putting that where you suggest in a few different ways (with/without the braces etc) and nothing worked. am i missing something?

thanks,
emily

[Nicoz]

Hi Emily,

If you don’t mind, can you tell me how did you reduce the width of the main frame?

Nikos

[laranz – SUPPORT]

Hi Nikos,

What do you mean my main frame? Can you give a brief description with your link or our demo.

Thanks,
laranz.

[Nicoz]

Hi Laranz, i was referring to the width of the box sized version of the theme. Is there a way to reduce the width from 1230 pix. to 1000 px ?

[laranz – SUPPORT]

Hi Nicoz,

You can add this in the style.css last line or Custom CSS in the Theme options.

@media (min-width: 1200px) {
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 960px;
}
}

But this only scratch the surface, you need to edit some other things if that requires or bugs your. I can help you to a limit only.

Thanks for understanding.

Thanks,
laranz.

[design_agency]

hi laranz,

can you answer my earlier question (#2 above)?

i’ve removed the padding around the logo, but when i make the browser window smaller i lose that fix. the logo becomes much smaller and there is space below the logo.

i tried the fix that cosmin sent over but it didnt work.

thanks,
emily

[laranz – SUPPORT]

Hi Emily,

I think that is due to the margin-top you set to the navigation section.


#nav-section
{
margin-top: 50px;
}

Try to adjust the margin top according to the screen width like Cosmin said.

Thanks,
laranz.