我的 HTML 表单出现了一些问题，我尝试查找它并在线寻找解决方案，但我发现的“解决方案”对我不起作用。我遇到的问题是我的单选按钮没有并排显示。而且我相信我知道原因，但如果我弄清楚是什么原因造成的，它就会破坏我其余的表格。
这是我的 HTML 代码:
<!DOCTYPE HTML>
<html>
<head>
<title>Survey</title>
<meta charset="utf-8">
<link rel="stylesheet" href="P9Style.css">
</head>
<body>
<h1 align="Center">
SURVEY
</h1>
</body>
<form method="post" action="http://webdevbasics.net/scripts/demo.php">
<br>
<label for="myName">Name:</label>
<input type="text" name="myName" id="Name">
<label for="myEmail">Email:</label>
<input type="text" name="myEmail" id="Email">
<br><br>
<label for="Favorite_Browser">Favorite Browser:</label>
<select size="1" name="Favorite_Browser" id="Favorite Browser">
<option value="Internet Explorer">Internet Explorer</option>
<option value="Mozzila Firefox">Mozzila Firefox</option>
<option value="Apple Safari">Apple Safari</option>
<option value="Opera Browser">Opera Browser</option>
</select>
<br><br>
Select your favorite Programming Language:<br>
<input type="radio" name="fav_Lang" id="fav_Lang" value="VB.net">VB.Net
<input type="radio" name="fav_Lang" id="fav_Lang" value="Java">Java
<input type="radio" name="fav_Lang" id="fav_Lang" value="HTML">HTML
<input type="radio" name="fav_Lang" id="fav_Lang" value="C++">C++
<input type="radio" name="fav_Lang" id="fav_Lang" value="Ruby">Ruby
<br><br>
<label for="myComments">Comments:</label>
<textarea name="myComments" id="Comments:" rows="3" cols="20"></textarea>
<input id ="mySubmit" type="submit" value="Submit">
<br>
</form>
<!-- Footer space-->
<div id="footer">
<br>
Copyright © 2013 Richard Paulicelli
<br>
You can send me an email at <a href="mailto:richardpaulicelli@yahoo.com">richardpaulicelli@yahoo.com</a>
<br><br>
</div>
<!-- End Footer space-->
这是我的 CSS 样式表代码:
form { background-color: #eaeaea;
font-family: Arial, sans-erif;
width: 350px;
padding: 10; }
label { float: left;
width: 100px;
display: block;
clear: left;
text-align: right;
padding-right: 10px;
margin-top: 10px; }
input, textarea, select { margin-top: 10px; display: block; }
#mySubmit { margin-left: 110px; }
#footer { background-color: #CCCFFF;
text-align: center;
color: #333333;
font-size: 1em;
clear: both; }
现在我认为导致问题的是我的 CSS 样式表，它就是这里的这一行:
input, textarea, select { margin-top: 10px; display: block; }
但是，如果我删除 input，它会修复单选按钮，但我的表单的其余部分会乱七八糟。
我试过 input.radio { display: inline;
我试过 #fav_Lang input.radio { display: inline; }(fav_Lang 是单选按钮的名称和 ID)。
所以我完全不知道该怎么做，任何帮助将不胜感激。谢谢:)
最佳答案
关于HTML 单选按钮不会并排显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20135602/