Question

“计算”和“清除”这两个按钮位于彼此之上，而不是彼此相邻。这适用于基本的计算器应用程序（解决方案在用户点击＆＃34;计算＆＃34;后出现在浅绿色文本框中）。 “计算”和“清除”按钮都位于div标签内。这是完整的html：

如果我将它们放在两个单独的div标签中，它们将分成两行而不是并排。不确定我做错了什么。在此先感谢您的帮助。这是我的CSS：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calculator</title>
<link rel="stylesheet" href="styles.css">
<script src="calculator.js"></script>
</head>
<body>
<section>
<h1>Calculator</h1>

<label> </label>
<input class="noLabel" type="text" id="sum" disabled="disabled">
<br>
<label>First Number:</label>
<input type="text" id="firstNumber">    
<br>
<label>Second Number:</label>
<input type="text" id="secondNumber">
<br>

<div>
<input type="button" id="calc" value="Calculate">
<input type="button" id="clear" value="Clear">
</div>

</section>
</body>

</html>

然后在CSS中div {margin-left：8em;}到div {margin-left：7.5em;}：

Answer 1

这是原因

input 
{
    margin-left: -5em;
    margin-bottom: .5em;
}

将其更改为

input:not([type='button']) 
{
    margin-left: -5em;
    margin-bottom: .5em;
}

为什么计算和清除按钮？

1 个答案: