Borders missing in IE

[DarkElf]

This is a bit of a strange one for me, normally I to find that most of my browser specific CSS problems relate to divs appearing in strange places in firefox (not that I don't love Firefox - just that it tends to be more fussy than IE). However today I have discovered something that is working beautifully in Firefox (and Netscape & Opera) but doesn't work in IE.I've got a div which spans the top of the page and contains menu links to the left hand side, there is also a help link which appears at the very other end of the div. Here's the code:HTML:

<div id="menu"><p style="float: right"><a href="help.html">Help</a></p><p><a href="page1.html">Page 1</a> | <a href="page2.html">Page 2</a> | <a href="page3.html">Page 3</a></p></div>

CSS:

/* Typography */body {font-family: arial;}p {font-size: 10pt;}a {text-decoration: none;}/* Layout */body {margin: 0px; padding: 0px;}div#menu {height: 15px; margin: 0px; padding: 8px;border-top: 2px solid white;}p {margin: 0px;}/* Colours */body {background-color: #FFFFFF;}div#menu {background-color: #95B3DE;}a {color: #FFFFFF;}a:hover {color: #000000; background-color: #D6DEEC; border: 1px solid black;}

As you can see, the hyperlinks should (in theory) change color and have a border around them on hover. This works exactly as it should for the links on the left, but the link on the right doesn't display the border on the top or bottom (but does to either side). I can't work it out, especially as it works in every other browser I have tried. Any ideas?

[raimo]

This is a bit of a strange one for me

And to me too! Have no idea why, but this will fix it:p {margin: 0px;padding: 1px; /* or padding: 2px if border is 2px etc. */}I tried it with position; abolute; right: 0 (no float) and it was the same with IE.But anyway same padding as borderd width will fix it .. strange things exists

[DarkElf]

Brilliant, that did the trick. Still don't understand why there was the problem, it's really wierd.