<!-- m --><a class="postlink" href="http://www.matts-website.net/alt/index2.html">http://www.matts-website.net/alt/index2.html</a><!-- m -->
Look at the menus and you will see a small piece of the border just above it missing. It's the same way on IE, FF, and Opera. I've seen menus done somewhat like this so I know it can be done.Chaneg your:
#nav h3 {
padding : 5px;
}
to:
#nav h3 {
padding : 0;
}
that should workNope. Let's see if I can explain it plainly enough now that I know what's going on. Since the border wouldn't be displayed with the <h3> tag in it's normal position, it is still missing even if you move the <h3> relative to where it's supposed to be.It is what you have done to position your lists in the place you want them that is causing the problem. Then you have not removed the padding and margins the list generates giving you a problem when it comes to aligning things up.
Do you have messenger or something I can quickly help you over before I go to bed?You are correct. The problem is the relative positioning of the h3 element. So, let's get rid of the relative top positioning, shall we?
Once you remove the top: 5px from #nav h3 and #code h3, set a negative bottom margin on both those element of the 5px to allow the ul to slide up. That should do it.Or I could just use a negative top margin on the <ul> tag.
It finally clicked in my head and I was going to post the solution, but then I saw how Pyro also had a solution for it.Yes, the negative margin would work on either element. You have a lot of messy CSS in the CSS file which is not needed.
You do stupid things to get something to do what you want it to because you are not thinking right.
Thus later you will have problems. My best advice is that you play around with CSS untill you understand how it works in each browser.The CSS doesn't even ball park being done. I already know that it needs to be reworked even in the current version, and in terms of cross browser issues, I've done limited testing on it. I've probably spent less than a half hour getting the code to where it is now.
Look at the menus and you will see a small piece of the border just above it missing. It's the same way on IE, FF, and Opera. I've seen menus done somewhat like this so I know it can be done.Chaneg your:
#nav h3 {
padding : 5px;
}
to:
#nav h3 {
padding : 0;
}
that should workNope. Let's see if I can explain it plainly enough now that I know what's going on. Since the border wouldn't be displayed with the <h3> tag in it's normal position, it is still missing even if you move the <h3> relative to where it's supposed to be.It is what you have done to position your lists in the place you want them that is causing the problem. Then you have not removed the padding and margins the list generates giving you a problem when it comes to aligning things up.
Do you have messenger or something I can quickly help you over before I go to bed?You are correct. The problem is the relative positioning of the h3 element. So, let's get rid of the relative top positioning, shall we?
Once you remove the top: 5px from #nav h3 and #code h3, set a negative bottom margin on both those element of the 5px to allow the ul to slide up. That should do it.Or I could just use a negative top margin on the <ul> tag.
It finally clicked in my head and I was going to post the solution, but then I saw how Pyro also had a solution for it.Yes, the negative margin would work on either element. You have a lot of messy CSS in the CSS file which is not needed.You do stupid things to get something to do what you want it to because you are not thinking right.
Thus later you will have problems. My best advice is that you play around with CSS untill you understand how it works in each browser.The CSS doesn't even ball park being done. I already know that it needs to be reworked even in the current version, and in terms of cross browser issues, I've done limited testing on it. I've probably spent less than a half hour getting the code to where it is now.