Need help? Check out our Support site, then


Navigation tabs

  1. southeasttourguides
    Member

    Is possible to wrap text on navigation tabs? I'm using Coraline. Explanation in words of very few syllable please!

    The blog I need help with is southeasttourguides.co.uk.

  2. Not really. You can set a "width" for the tabs, but since you aren't in control of each person's browser, custom settings that they have made can affect what they will see.

    You could shorten "Day Tours from London" to just Day Tours, which will bring things back to a single line, but then the theme you are using is a flexible width theme (narrow down your browser window to see what I mean) so on smaller monitors the navigation will go to two lines regardless of what you do.

    You could tighten up the spacing between the menu items, but I don't think you can tighten things up enough to bring it back to one line.

    Sorry to give you so much to think about, but there is another solution and that is to widen the theme and then make it so that it does not narrow with the browser window width. Currently it is set for a maximum width of 770px, and we could go up to 970px without any issues. I would suggest that if you do this, you make sure the mobile theme is activated at appearance > mobile in your dashboard so that those on smartphones or tablets will have a more pleasurable viewing experience.

  3. southeasttourguides
    Member

    Wow, thank you fore coming back to me so quickly, I understand what you are explaining and I THINK I can put it into practice.
    Many thanks again
    Dawn

  4. southeasttourguides
    Member

    Well, I've done the appearance>mobile trick - easy, but I'm very new to CSS. I've found <div id="header"> but I cannot see the current px in order to increase the width.

  5. With the theme you are using, making it wider is quite easy actually. Add this to the bottom of any custom CSS you have and then adjust the 770px value as desired. I wouldn't go much over 990px in width since you want to keep it to where it will show completely on a 1024px wide monitor. 870px works with your menu as it is right now.

    .two-column #container {
    width: 770px;
    }
  6. southeasttourguides
    Member

    Yeees! Done it, that was my first venture into CSS - many thanks for your help. Umm, can you tell me how to change the size of the text in nav. menu?
    Thank you for your help
    Dawn

  7. Before you know it you will be a CSS guru!

    Add this to your custom CSS and then edit the font size as you desire.

    #access li {
    font-size: 14px;
    }
  8. southeasttourguides
    Member

    Fantastic, thank you so much!

  9. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic