CSS! The problem is with the webkit, the horizontal menu actually goes up so that it is not visible?
But for some reason this happens in webkit (safari, chrome) browsers, although in opera, IE and Firefox there was still no place, why does this happen and how will it not be treated? ps The menu is rubber, and this should remain. Here is an example.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Crossbrowsing Menu</title> <style> /* MENU */ div.bmenu { position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 6%; background: #c2c2c2; } div.bmenu a { position: relative; display: inline-block; white-space: nowrap; width: 20%; float: left; margin: -6.5% 0 0 0; outline: none;} div.bmenu img { height: 100%; width: 100%; } div.bmenu a:hover { margin: -5% 0 0 0; z-index: 2; } </style> </head> <body> <div class="bmenu"> <a class='mlink' href="#"><img alt='' name="test" border=0 src='menu/test.png'></a></li> <a class='mlink' href="#"><img alt='' name="test" border=0 src='menu/test.png'></a></li> <a class='mlink' href="#"><img alt='' name="test" border=0 src='menu/test.png'></a></li> <a class='mlink' href="#"><img alt='' name="test" border=0 src='menu/test.png'></a></li> <a class='mlink' href="#"><img alt='' name="test" border=0 src='menu/test.png'></a></li> </div> </body> </html>