AutoSize Font in Menu + Menu always on TOP (Without HeaderImage)

Hello, I want to know two things:

Fist one. Is it possible to autosize the font of Menu elements?. My problem is that if the Screen of the computer is smaller than 1900px for example, the menu is bigger and is made in two rows. So I want to make for example in netbook the menu is in one line but the Words/Elements are with a small size to be able to fit in one row. If my Screen is 1900px the biggest size that allow to be in only one row.

Second, I know how to make something on top always but the problem is that the menu is always linked with the header image so if I want menu always on top, the header image is also on top, so I waste a lot of space in the window.

Thanks and sorry for my english!

Hi @gonzimalaga,

I hope you are well today and thank you for your questions.

Fist one. Is it possible to autosize the font of Menu elements?. My problem is that if the Screen of the computer is smaller than 1900px for example, the menu is bigger and is made in two rows. So I want to make for example in netbook the menu is in one line but the Words/Elements are with a small size to be able to fit in one row. If my Screen is 1900px the biggest size that allow to be in only one row.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Additional CSS

@media screen and (max-width: 1900px) {
.navbar-default .navbar-nav > li > a {
    font-size: 10px;
}
}
Second, I know how to make something on top always but the problem is that the menu is always linked with the header image so if I want menu always on top, the header image is also on top, so I waste a lot of space in the window.

Is it ok if we hide logo when you scroll the site and header menu becomes fixed?

If yes then could you please share me your site URL where it’s displaying so that i can help you to achieve it?

Best Regards,
Movin

  1. But that would make an standard size no?
    I want for example if the window is 1800px Size is 12px. If you reduce or your screen is smaller like 1000px the size is 9px.
    (So that way i want always a single row to display the menu)

  2. I have it on manteinment. I think on wednesday i will open it and we could see.
    I have only header image and menu, no logo. So i want only the menu to be floating.
    I did it with #menu-menu but it only get the words (without background)

1. But that would make an standard size no? I want for example if the window is 1800px Size is 12px. If you reduce or your screen is smaller like 1000px the size is 9px. (So that way i want always a single row to display the menu)

You have to develop custom CSS code and add more media query conditions in the above shared CSS code. You can refer v to get more information about media queries.

2. I have it on manteinment. I think on wednesday i will open it and we could see. I have only header image and menu, no logo. So i want only the menu to be floating. I did it with #menu-menu but it only get the words (without background)

OK then please let me know when you remove maintenance mode.

  1. I’ll try :slight_smile:

  2. Now is online http://santamariadelavictoria.es/

  3. Another thing is that web’s width has like an extra border of a few pixels. The menu and header have full wifth but there’s a little more space in the right side (regardless off the width I put). How can i fix it? (I attach a photo)

Second, I know how to make something on top always but the problem is that the menu is always linked with the header image so if I want menu always on top, the header image is also on top, so I waste a lot of space in the window.

The menu is not always on top on your shared site so i don’t see the issue.

Please advise.

3. Another thing is that web’s width has like an extra border of a few pixels. The menu and header have full wifth but there’s a little more space in the right side (regardless off the width I put). How can i fix it? (I attach a photo)

To help us keep support thread separates could you please create new thread for each of your other questions here https://colorlibsupport.com/c/sparkling/ instead of asking them in your single thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.