Hello, I'm doing some layout things and thanks to this I discovered a very odd problem that shows in IE6. It's in the header section, the menu shows one pixel wider than the logo, on the right hand side, on all pages except for the forum. The thing that really amazes me is the fact that the only difference in layout is that the menu in the forum header is inside a table inside the wrapper, on the rest of the site it's simply within the main wrapper. I know my forum layout has some validation errors but they don´t have anything to do with the problem. I know this because when I stick the menu on any other page inside a table the 1 pixel difference disappears too. I tried to put the menu inside a div set at 100% width but that doesn´t fix things. I tried several other things, different padding and margins, but all of that breaks the layout more. Who is able and willing to tell me why that one pixel extra width on the right side of the menu disappears when I put it inside <table width="100%" cellspacing="0" cellpadding="0" border="0"> <tr> <td> </td> </tr> </table> Code (markup): Greetings.
Your Javascript message is lawlz : ) So how do they know which words are the key words? Still, I like it : ) But anyway, about the menu... I wonder if somehow that table is affecting a double-margin float bug (removing it)? You have no side margin on the menu itself but you do have 1px on the floated lis, and if it was the bug, it would be... only affecting the first li. I don't have IE now, I'm at home, but that's what I'd wager. I guess you could give it a try?
That javascript is very neat, super-simple but it helps a great deal because it prevents people from submitting empty search-queries. Which in turns makes it easier for people to get quick results and thus remain on the site instead of hopping out because they don't find what they want on the first click. The keywords are the words they want to search for, obviously, so they should know them, not me. Anyhow, they can also go to the advanced search clicking the label below the search box. About those floating lis, I guess you mean those? #menu li { float:left; width:105px; height:22px; position:relative; background-color:#F8FFF8; text-align:center; margin:1px 1px 0 0; z-index:15; } Code (markup): If I take the 1px right-margin away all the vertical green dividing 1px lines between the menu-links disappear, the far right 5px border grows I guess 5 px but that extra pixel on the far right disappears. This was the only thing I had found that influences that extra px but, it doesn´t really solve things, it only changes the problem. I really appreciate your looking at this, I hope you can find something later.
That's why I thought it was funny at first, cause it seemed funny that people would hit search with nothing typed in... and then a read it again and thought you meant that people were typing words, but the search wasn't working because they weren't "key" words... So no, I guess I got it the first time : ) For the li's, no, KEEP the 1px margin, but if IE6 is doubling it to 2px on the first li... we can test if that's the case, add display: inline to the code. To eliminate the double-margin bug. if nothing changes when you add it (and all other browsers ignore display: inline on something already floated), then it's not double-margin float bug. But I hope it is, cause that's easy fixin : ) #menu li { float:left; [b]display: inline;[/b] width:105px; height:22px; position:relative; background-color:#F8FFF8; text-align:center; margin:1px 1px 0 0; z-index:15; } Code (markup): I've got my fingers crossed.
Yes, That was it, solved! It wasn't doubling a 1px on the first li, it was adding an extra px to the right hand 5px border. Thanks a lot, it's incredible how much a victory over 1 pixel in an ancient browser can mean for someone. My search engine is sphider which means I have access to search logs and can see how many times queries are used. It was surprising to see how many people entered empty queries. Until I discovered that simple js-trick. Thanks a lot cloggie!
I'm glad it worked, although while walking tonight I remembered that I think Paul O'Brien said floats in floats don't get the doubled margins... so now I wonder what was going on. And yet, display: inline doesn't do a thing anywhere with floats, except remove that margin bug. Stumped.