添加提交按钮时css不起作用?

时间:2014-03-21 03:16:42

标签: css forms internet-explorer checkbox

<?
$time = $_POST['time'];

echo 'you have choosen '. $time;

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
.radio > input[type=radio]{
    position:absolute;
    margin-left:-99999px;

}
input[type=radio] + span{
  cursor:pointer;
  border:2px solid transparent;
}
span.active{
  background-color:green;
}

.but1{
    background-color:#009;
    color:#FFF;
    border:none;
    border-radius:15px;
    width:200px;
    height:50px;
    font-size:18px;
    font-weight:bold;
    border-radius:15px;
    text-align:center;
    padding:8px;
    font-family:Verdana, Geneva, sans-serif;
    float:left;
    margin-left:10px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>
</head>

<body>
<form action="Untitled3.php" method="post">
    <label class="radio" for="fb1">
    <input id="fb1" type="radio" name="time" value="all day" checked />
    <span class="but1 active">Available<br>All day</span>
  </label>

  <label class="radio" for="fb2">
    <input id="fb2"  type="radio" name="time" value="between 8-12"/>
    <span class="but1">Between<br>8am - 12am</span>
  </label>

  <label class="radio" for="fb3">
    <input id="fb3" type="radio" name="time" value="between 12-4" />
    <span class="but1">Between<br>12pm - 4pm</span>
  </label>
<input name="submit" type="submit" value="send" />
<script type="text/javascript">
$('.radio').click(function(){

                if( $(this).find('input').is(":checked") ){

                    $('.radio span').removeClass('active');
                    $(this).find('span').addClass('active');                      
                } 
});
</script>
</form>
</body>
</html>

为什么当我添加提交按钮时,CSS在IE中不起作用,但在所有其他浏览器中都没问题。当我删除按钮时,CSS在所有浏览器中都能正常工作吗?

请帮助,这个问题正在推动我的坚果,IE应该被禁止。

按钮的实时代码为http://goo.gl/LbSWQG

0 个答案:

没有答案