Why is this ul element so large?

Why is this ul element so large?

I’m having trouble understanding why this ul element (linked above) is so large.

here’s a link to the live practice site.
if you inspect the page, you’ll see what i’m talking about. it’s positioned below the .top-container div and is a part of my #top nav which just contains the nav links below the search bar.

it doesn’t seem like a margin issue. and when i set a height to it, the rest of my doc just gets weird. i may be misusing some position: absolute, or relative, but im just not sure where.

There is something inside of your nav list that is causing the height on the nav to be much bigger than it needs to be. You are missing it because it seems like it shouldn’t be a problem since you are currently reducing the size of it. But they way you are making it smaller doesn’t actually make it smaller as far as the height on the nav is concerned. Find another way to make it smaller.

1 Like

i realized it was the color-search icon. i was using transform, which i’ve learned is a horrible way to ‘resize’ elements.