清除ul float菜单在IE8，Chrome中不起作用.仅适用于Firefox [英] Clearing ul float menu not working in IE8, Chrome. Only works in firefox

问题描述

我有一个菜单，单击图像后会打开打开.但是，它弄乱了除Firefox之外所有浏览器中其余的布局.

我的CSS代码

I have a menu that opens open when an image is clicked on. However it messes up the rest of my layout in all browsers except firefox.

My CSS code

.signin_menu {
	position:relative;
 	: "."; 
	float:left;
	overflow:hidden;
	margin-left: -230px;
    	margin-top: 34px;
   	display:none;
    	width:190px;
   	list-style-type: none;
   	z-index: 5;
   	color:#FFFFFF;
}
.signin_menu li {
   	background-color: #000000;
   	padding:8px; 
}
.signin_menu ul {
	margin:0; 
	padding:0; 
	list-style:none;
}
.signin_menu li a {
   	color:#FFFFFF;
   	text-decoration:none;
   	padding:10px;
}
 
.signin_menu li a:hover {
    	padding:10px;
   	font-weight:bold;
   	color: #b0b0b0;
}
.signin_menu:after { /* FF, IE8, O, S, etc. */
	display:none; 
 	visibility:hidden; 
 	clear:both; 
 	height:0; 
 	content: "."; 
 }

菜单

The menu

<ul class="signin_menu">
  	
  	<li>
    <form id="form1" action="login.php" method="post">
      <?php echo _('Username'); ?>
      <input type="text" name="username" id="username" />
      
        <?php echo _('Password'); ?>
        <input type="password" name="password" id="password" />
      
       <?php echo _('Not a member?'); ?> - <a href="register.php"><?php echo _('Register'); ?></a> <?php echo _('now!'); ?>
       <input type="submit" id="login" name="login" value="<?php echo _('Sign in'); ?>" />
      
            <center><div id="message"></div></center>
	</form>
	<?php echo _('Or log in with Facebook'); ?>:
	<a href="<?php echo $loginUrl; ?>"><img src="images/loginfb.png" border="0"></a>
	</li>
	
  </ul>

我尝试了许多不同的方法，但是以上是我迄今为止所能做到的最好的方法.将ul更改为div并删除li标签会给我相同的结果.

I have tried many different ways but this above is the best I''ve got so far. Changing the ul to a div and removing the li tags gives me the same result. Any ideas?

推荐答案

loginUrl; ?>" < src =" images/loginfb.png" 边框 =" > < /a > < /li > < /ul >

loginUrl; ?>"><img src="images/loginfb.png" border="0"></a> </li> </ul>

我尝试了许多不同的方法，但是以上是我迄今为止所能做到的最好的方法.将ul更改为div并删除li标签会给我相同的结果.有什么想法吗?

I have tried many different ways but this above is the best I''ve got so far. Changing the ul to a div and removing the li tags gives me the same result. Any ideas?

我通过绝对定位而不是相对定位来修复它.菜单位于网站标题中.

I fixed it with absolute positioning instead of relative. The menu was in the header of the site.

这篇关于清除ul float菜单在IE8，Chrome中不起作用.仅适用于Firefox的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！