hi guys. can anyone help me?
I want to remove space from this navigation menu
I tried all the things but don’t know what’s wrong
hi guys. can anyone help me?
I want to remove space from this navigation menu
I tried all the things but don’t know what’s wrong
Hello!
I assume you’re using Firefox, right? I’ve been having troubles with it lately in regards to the whitespace
.
TL;DR; The fix is to add this to the CSS:
ul {
white-space: no-wrap;
}
/* or, if you want to target only the list on the navbar */
#navbar ul {
white-space: no-wrap;
}
Your code is fine on Opera and Chrome (WebKit based browsers), but Firefox is taking into account every whitespace
as something that has to use space.
If you inspect your page using the HTML Inspector (Control + Shift + i then click on the Inspector tab on Firefox), you will see that there is an element called whitespace
between your li
elements:
Another thing… when you use codepen, you don’t need to include the body
, head
or html
tags, since these are generated for you. If you need to include scripts, external CSS libraries (bootstrap, for instance), do so on the settings for the pen:
I hope it helps ,
Stay safe and happy coding!
Thank you so much for your reply. I am using Chrome. But Still not work.
Hey supan,
I looked at your Pen and I think that when you style the ul li
, you should add margin: -3px
and change the border
from 2px solid
to 2px solid black
. You might have to add more margin-top
and/or margin-left
in the ul
element, but overall it should be fine.
Hope this helps!
hiii kudouz,
thank you so much for your help. I already solved this problem. yes the problem was in margin