p.s. I can “solve” this by setting top to -16px, but I suppose that it will not be good for different-sizes screens and I don’t like it as a definitive solution.
try this in your css
ul {
margin: 0;
}
ps.: I think your html layout is not in good shape. You may want to think about it a bit before coding.
Better but still some space…
Which changes do you think I have to do in html?
Hey @dotpicons, by default some elements like
ul, p, h1 to h6, these have default margins and padding set up, for ul there is a left-padding by default, therefore you have to set padding to 0 and you can modify it for your need
And when you use fixed prop to place it at top, you have done it correct but the flow should be from left to right, therefore along with top: 0, you also have to set left: 0
Do you have a CSS-reset stylesheet? If not, try adding this block of code to the top of your stylesheet to see if it changes anything:
* {
margin: 0;
padding: 0;
}
Usually it’s the body element that gives the extra padding or margins. If that doesn’t help let me know.
P.S. you might want to add a z-index with a high number to your ul so that it sits on top of any other elements, like this:
ul {
z-index: 999;
}