Side bar (menu) too big on Rapidweaver 8

RapidWeaver Classic
1

Hi,
Im ashamed to say my knowledge on this is basic but I upgraded to RapidWeaver 8 and remade my website. Although it looks good at first sight there seems to be a few glitches.
1, The side bar is too long when used on iPhone as it hits the main menu. This is all ok on a regular computer as it goes along the top.
2, I can’t seem to change either font or the size of the title, slogan, but I am able to change the size of the side bar text but not how it operates.

Im sure there is a simple explanation but I’ve now had a weekend of it so any help will be greatly appreciated.

2

Hi @Nadand

With respect, you have not mentioned anything really that could be used to help you. For example:

  • What is the URL of the website in question? If we can’t see it, its tough to be able to work out whats wrong.

  • What theme are you using? Are you using the Stacks plugin?

  • What fonts are you seeing? What fonts do you want? What options have you selected in your project to support your intentions?

Here is a link to a brilliant article which explains how to ask for assistance in a effective manner:
https://forum.rw4all.com/t/requesting-technical-support-like-a-pro/537

3 Likes
3

OK, I understand. I hope the info below will be of more help.
I upgraded to RapidWeaver 8 and created a website using the Mountains theme, not Stacks plugin. I have 10 pages on the menu which drops down when viewing on a phone and then it collides with the main title making the text difficult to read.
I would like to reduce the size or position of the title to stop this happening. I’m not that worried about changing the font at the moment.
You might be a able to see by looking at www.dentalcreationadelaide.com

Thanks again

4

I think the problem you’re having might better be addressed by adding a slightly transparent background when the drop-down menu is triggered. To just reduce the size or position of the title would probably not address the overlap on every possible screen-size and orientation(landscape, portrait).
Try adding the following CSS and see what you think:

div#navbarNav.show {
    background: rgba(17, 6, 11, .7);
    z-index: 2;
}
2 Likes
5

Hi Doug,
Thanks so much for your input. It looks much better now but what do I change to make the background totally opaque?

6

On the rgba settings the Alpha(last digit) set above to .7, controls the opacity of the color (a = 0 = transparent; a = 1 = opaque).

The rgb stands for red, green, and blue and is used to set the color.
You can find more information here:
https://www.w3schools.com/cssref/css_colors_legal.asp

1 Like
7

Thank you so much for your help!

1 Like
8

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.