customizing font size in responsive nav dropdown

[mjb]

Hi. I noticed the font size of the responsive nav bar drop down has a maximum size of 18.
Can this be increased possibly using css? If so where would I insert the custom css?

[Egg Bramhill]

Hi MJB, there's no restriction on font sizes. This link might help:

http://www.talkgraphics.com/showthre...on-mobile-site

[mjb]

Thank you Egg,

I tried setting the font past 28 and it wont accept the changes. Is this not a restriction on font sizes or am I doing something wrong? I'm using xara web designer 10 premium. Any help would be greatly appreciated.

[Ben.Moses]

Hi,

There is currently a limit on the Pop up menu font sizes, which I think are 8-28px. You can change this by including some code in your head section which changes the style of them, however this is specific to your website as the mobile Nav bar and main Nav bar are given names when exported and these need to be specified.

[mjb]

Hi,

There is currently a limit on the Pop up menu font sizes, which I think are 8-28px. You can change this by including some code in your head section which changes the style of them, however this is specific to your website as the mobile Nav bar and main Nav bar are given names when exported and these need to be specified.

Thanks Ben. Could you please give me a simple example (change font size to 35) of how to add extra code into the head section? Sorry to burden you. I just can't find any examples of this online.

[Ben.Moses]

Hi mjb,
So because it's specific to your doc, I couldn't write one for you that will always work, however if you upload your doc onto here, I'll have a look and write a quick tutorial for how to do it, and give you the example code you need.

If your comfortable finding out the class for your Nav Bar's dropdown, just put that into the example code below, replacing the "#xr_nb1" with your dropdown class, otherwise upload your file, and ill quickly make a tutorial for TG.
<style>
#xr_nb1 {
font-family: Arial;
font-size: 35px;
}
</style>

[mjb]

Thanks Ben,

I'll upload a .web file as soon as possible.

Thank you for your gererosity of knowledge and time.

[mikeymopar]

an easy work-around that you'd have to do anytime you made design changes to your site....open up your xr_main.css with an editor (notepad++, etc) search for some odd font size like 9px or 27px - whole word only or something to that effect. if no results are found you can use this size as a marker. then back in xara, set the popup size for each design that you wish to change (main and/or mobile variant) to what came back with no found size (9px or 27px or whatever) and export the html. open xr_main.css again with your editor and search for the 9px or 27px - whole word only and you'll see all the places you can change that size to what you want. either manually or one of the tabs in your editor also has a search and replace feature. but unless you're experienced enough and know you're not changing too much, i'd recommend changing the size manually. save the newly changed xr_main.css file and preview the site in your browsers

(there's gonna be more than one instance found, especially if you've got different mobile variants, in xr_main.css if your dropdown links to other pages (several xr_nb##). that's why searching and replacing it will find it for all dropdowns on every page, not just xr_nb1)

[mjb]

Thanks Mikey Mopar.

I'll give that a try for sure. Also I noticed google chrome on the ipad and iphones does not have a close menu automatically ability. Is there a work around for this as well?

[mjb]

Hi Ben. I made a sample file of the drop menu i"m looking to make changes on.

See attached