想象一下网络上的数学问题。我想显示数学问题,然后让用户能够在其右侧键入他们的答案。我正在尝试建立结构。我有自定义按钮,可用于更改答案的内部文本。
数学问题由 给出,"problemtext"
答案由 给出"problemanswer"
。当用户点击数字键盘时,我将把该数字放在"problemanswer"
片段中。
这种设置的问题在于答案显示在问题下方。
但我希望答案直接在问题的右侧,而不是在它的下方。此外,我希望答案周围有一个框(或边框)。我怎样才能做到这一点?我的 html/css 应该是什么样的?
<div id="problem" class="text" style="display:none">
<div id="problemoverall" align="center">
<div id="problemtext" style="font: bold 65px Arial;">
</div>
<div id="problemanswer" style="font: bold 65px Arial;">
</div>
</div>
</div>
这是我拥有的一些相关CSS
.text {
text-align:center;
font-size:16px;
line-height: 165%;
color:#f1f1f1;
}
.text p {
margin: 8px 0;
}