Forums

tannercampbell

Hey guys,

Having an issue with my CSS menu. It's a styled unordered list. I've used this technique many times in the past, however this time around I'm hitting a snag. If you visit the page below you'll see that there is an uncalled for (or seemingly so) additional amount of spacing above the menu, almost like a margin or a bit of padding ... but I haven't instructed there be any. I'm sure this is a simple fix and I've just been staring at it for too long. Anyone want to give me a hand? http://tannercampbell.com/dishestv

Many Thanks,
Tanner Campbell

*On a side note: Constructive criticism is always welcome. This is a website for a friend of mine who's trying his hand at affiliate marketing -- I'm trying my best to match the parent site: http://www.vmcsatellite.com

cpj238

Try this:

#topordertab {
    position: absolute;
    right: 0;
    top: -16px;
}

tannercampbell

238, you're brilliant. Could you explain to me WHY that worked so I can learn from this? Thanks!

cpj238

When #topordertab was floated right it still retained the stacking order of being on the left, so the space of its height was left behind. When you make it absolute it "picks it up" and places it in the appropriate spot.

Glad I could help. Something to note though, using right:; might not appear correctly in some versions of IE, if you want full control, use left:; and adjust from there.

clokey2k

In simple terms,

#topordertab{
	 top: -100px;
	 }

left a 100px gap from were it was in the flow of the document.

treehouse : what would you like to learn today?

Forums

Spacing Issue With CSS Unordered List Menu - A little help?