Change height of navbar

More
2 weeks 5 days ago - 2 weeks 5 days ago #160909 by Robert1973
Robert1973 created the topic: Change height of navbar
Hi there,

I would like to change the height (make it less high) of the top navbar of my survey. I'm not that familiar with the code, so I'm googling and doing attempts based on trial & error. But, without much luck. Does anyone know how to do this?

Below the navbar, I'm displaying an image as part of the question, but there's (too much) whitespace between the navbar and the image. Is there a way to change this?

Many thanks in advance, kind regards,
Robert Vloet

(Limesurvey Version 2.50+ Build 160219)
Last Edit: 2 weeks 5 days ago by Robert1973.

Please Log in to join the conversation.

More
2 weeks 4 days ago #160912 by tpartner
tpartner replied the topic: Change height of navbar
What template are you using?

Can you provide a screenshot of the space you want removed and a link to a test survey?

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

Please Log in to join the conversation.

More
2 weeks 4 days ago #160925 by LouisGac
LouisGac replied the topic: Change height of navbar
Hi Robert,

first you should update to the latest version, we fixed some security issues since 160219.
Then, templates are using bootstrap, so your question is how to change the height of the bootstrap navbar.
Here the first google links for "change the height of the bootstrap navbar":
bootstrapious.com/p/how-to-change-bootstrap-navbar-height
stackoverflow.com/questions/18599778/dec...bootstrap-3-0-navbar
stackoverflow.com/questions/19837444/cus...ht-bootstraps-navbar
The following user(s) said Thank You: Robert1973, tomtom

Please Log in to join the conversation.

More
2 weeks 4 days ago #160926 by tomtom
tomtom replied the topic: Change height of navbar
Hi Tony, I've got the same question here, and I am using the default template, flat_and_modern.css. I have tried to append "height: 30px;" to ".navbar-default {}", but nothing change. Thank you.

Please Log in to join the conversation.

More
2 weeks 4 days ago #160927 by Joffm
Joffm replied the topic: Change height of navbar
Hi, tomtom,

in the first link Luis provided is everything you need.


I just changed the min-height and height to the desired value just to see that it works.

Best regards
Joffm
Attachments:
The following user(s) said Thank You: Robert1973

Please Log in to join the conversation.

More
2 weeks 4 days ago #160950 by Robert1973
Robert1973 replied the topic: Change height of navbar

tpartner wrote: What template are you using?

Can you provide a screenshot of the space you want removed and a link to a test survey?



Hi Tony, thanks for your quick reply.

I'm using the Default template with several adjustments (practically all documented).
I've added Louis'/Joffm's code, which helps indeed to make the navbar smaller, however the white space increases. In other words : the image starts at the same position.

Attachments:

Please Log in to join the conversation.

More
2 weeks 4 days ago #160951 by Robert1973
Robert1973 replied the topic: Change height of navbar

LouisGac wrote: Hi Robert,

first you should update to the latest version, we fixed some security issues since 160219.
Then, templates are using bootstrap, so your question is how to change the height of the bootstrap navbar.
Here the first google links for "change the height of the bootstrap navbar":
bootstrapious.com/p/how-to-change-bootstrap-navbar-height
stackoverflow.com/questions/18599778/dec...bootstrap-3-0-navbar
stackoverflow.com/questions/19837444/cus...ht-bootstraps-navbar


Hi Louis, thanks for your reply. I've added the code from the first link to my template.css, and that works. So that's great :-)
Only problem that needs to be fixed is the white space between navbar and image.

PS the other 2 links are a little bit beyond my knowledge to fully comprehend.

Please Log in to join the conversation.

More
2 weeks 4 days ago #160952 by Robert1973
Robert1973 replied the topic: Change height of navbar

Joffm wrote: Hi, tomtom,

in the first link Luis provided is everything you need.



I just changed the min-height and height to the desired value just to see that it works.

Best regards
Joffm


Hi Joffm, thanks for this and pointing me in the right direction! :-)

Please Log in to join the conversation.

More
2 weeks 4 days ago #160954 by Robert1973
Robert1973 replied the topic: Change height of navbar

tpartner wrote: a link to a test survey?



Forgot the link :

37.252.121.232/bewustzijnmeter/index.php...49/newtest/Y/lang/nl

Please Log in to join the conversation.

More
2 weeks 4 days ago - 2 weeks 4 days ago #160955 by tpartner
tpartner replied the topic: Change height of navbar
To avoid messing with the whole template, I would simply give the image an inline style to push it up.

<img alt="" src="/bewustzijnmeter/kaarten/TFH-IC 1.1 Rust 3.jpg" style="width: 100%; margin-top: -50px;" />

Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last Edit: 2 weeks 4 days ago by tpartner.
The following user(s) said Thank You: LouisGac, Robert1973

Please Log in to join the conversation.

More
2 weeks 4 days ago - 2 weeks 4 days ago #160963 by Robert1973
Robert1973 replied the topic: Change height of navbar

tpartner wrote: To avoid messing with the whole template, I would simply give the image an inline style to push it up.

<img alt="" src="/bewustzijnmeter/kaarten/TFH-IC 1.1 Rust 3.jpg" style="width: 100%; margin-top: -50px;" />


This works very well, thank you Tony!

I now use something like :
<img alt="" src="/bewustzijnmeter/kaarten/TFH-IC 4.3 Voelen 3.jpg" style="height: 80vh; max-width: 100%; margin-top: -60px; float: left;" /></div>

The result is an image on the left side and my question right next to it. However, the answers are below my image and would like to have them next to the image. See enclosed picture.

Do you know how to do this?
Attachments:
Last Edit: 2 weeks 4 days ago by Robert1973.

Please Log in to join the conversation.

More
2 weeks 3 days ago #160965 by tomtom
tomtom replied the topic: Change height of navbar
Great Joffm!

My changes:

Org:
.navbar-brand {
float: left;
padding: 19.5px 15px;
font-size: 20px;
line-height: 18px;
height: 18px;
}

New:
.navbar-brand {
float: left;
padding: 5px 10px;
font-size: 16px;
height: 15px;
}

Please Log in to join the conversation.

Start now!

Just create your account and start using Limesurvey today.

Register now
Join our Newsletter!