regdude Posted May 2, 2010 Share Posted May 2, 2010 Hi! I used this script: http://javascript-array.com/scripts/simple_drop_down_menu/ to make a menu in a PHPBB2 forum. From the IE view it is all fine, but from FF/Chrome it goes wrong! As here: http://img580.imageshack.us/img580/3213/menub.jpg So the first is that the menubar background for some reasons goes 2 times bigger and messes up the background, the second thing is that the hover background of a button doesn't seem to cover up all text. Here is the style: <style type="text/css"> #topmenu { z-index: 30 } #topmenu li { list-style: none; font-size: 11px; font-weight: bold; color: #EEEEEE; float:left } #topmenu li a { display: block; font-size: 11px; font-weight: bold; padding: 4px 8px 6px 8px; width: 60px; background-image: url(images/cellpic2.gif); background-repeat: repeat-x; color: #EEEEEE; text-decoration: none } #topmenu li a:hover { background: #FE9801 } #topmenu div { position: absolute; visibility: hidden; margin: 0; padding: 0; background-image: url(images/cellpic2.gif); background-repeat: repeat-x; border: 1px solid #4F4F4F } #topmenu div a { position: relative; display: block; margin: 0; padding: 5px 10px; width: auto; white-space: nowrap; text-align: left; text-decoration: none; background: #4F4F4F; color: #FFFFFF; font-size: 11px } #topmenu div a:hover { background: #FE9801; color: #FFFFFF } </style> Link to comment https://forums.phpfreaks.com/topic/200444-browser-problem-with-menu/ Share on other sites More sharing options...
Hybride Posted May 2, 2010 Share Posted May 2, 2010 Comparing the original versus yours, you removed some of the margin/padding resets in some cases (such as the #topmenu, #topmenu li), which would be affecting the code placement. And also, never design for IE first, always FF/Opera/Chrome, then you go back and fix the code for IE. They have much stricter, proper restraints when it comes to designing CSS-wise, and IE often implements the CSS commands differently than the other browsers. Link to comment https://forums.phpfreaks.com/topic/200444-browser-problem-with-menu/#findComment-1051999 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.