这部分PHP和CSS需要JavaScript吗？或者仅仅使用css就可以吗？_Javascript_Php_Jquery_Html_Css

这部分PHP和CSS需要JavaScript吗？或者仅仅使用css就可以吗？

javascript php jquery html css

这部分PHP和CSS需要JavaScript吗？或者仅仅使用css就可以吗？,javascript,php,jquery,html,css,Javascript,Php,Jquery,Html,Css,大家好，所有的css都适用于所有的计算，比如add、mult、sub、div，但是当我显示所有的css时，我该如何更改css，在点击“display all”按钮时将其更改为一个更大的框呢。如果您看到我的显示块的CSS代码#答案，它只适用于单个数字值，但我如何调整CSS，以便在用户计算更大的数字时更改宽度和高度，或显示所有数字这是这里的代码 <html> <body> <style><?php include "style.c

大家好，所有的css都适用于所有的计算，比如add、mult、sub、div，但是当我显示所有的css时，我该如何更改css，在点击“display all”按钮时将其更改为一个更大的框呢。如果您看到我的显示块的CSS代码#答案，它只适用于单个数字值，但我如何调整CSS，以便在用户计算更大的数字时更改宽度和高度，或显示所有数字

这是这里的代码

<html>
    <body>
         <style><?php include "style.css" ?></style>
            <form action="index.php" method="POST">
                <table border="1">
                   <td>
                      <p>insert value one: <input type="text" name="num1"> <br>
                      <p>insert value two: <input type="text" name="num2"> <br>
                   </td>
                   <td>
                       <input type="submit" name="add" value="Addition">
                       <input type="submit" name="sub" value="Subtraction">
                       <input type="submit" name="mult" value="Multiplication">
                       <input type="submit" name="div" value="Division">
                       <input type="submit" name="all" value="Display All">
                   </td>
                 </table>
              </form>
 <div id="answers">
   <?php
    if (isset($_POST['num1']) && ($_POST['num2'])){
      $val1 = $_POST['num1'];
      $val2 =   $_POST['num2']; 
      $add = $val1+$val2;
      $sub = $val1-$val2;
      $mult = $val1*$val2;
      $div = $val1/$val2;   
    }

    if (isset($_POST['add'])){
      echo $add;
    }
    if (isset($_POST['sub'])){
      echo $sub;
    }
    if (isset($_POST['mult'])){
      echo $mult;
    }
    if (isset($_POST['div'])){
      echo $div;
    }
   if (isset($_POST['all'])){
      echo $add . "<br>" . $sub . "<br>" . $mult . "<br>" . $div . "<br>";
    }
?>

</div>  

    </body>
</html>

您可以尝试使用

minwidth

和

minheight

使方框根据其内容展开，但不能低于指定的最小值，而不是

width

（请参见下面的注释）和

height

在这里，您可以看到几个仅具有

min height

的示例：

请注意，

display:block

（divs的默认设置）默认情况下将宽度设置为100%，尽管您可以使用

display:inline block另一个选项是设置#answers to display:table单元格，并在其周围创建一个包装div以display:table
例如：
//CSS
#answers{
  margin: 10px auto;
  width: 100px;
  padding: 0 10px;
  display: table-cell;
  background-color: tan;
  text-align: center;
  line-height: 30px;
  border: solid black 1px;
}
.answers-wrapper {
    margin: 0 auto;
    text-align: center;
    display: table;
}

//HTML
<div class="answers-wrapper">
    <div id="answers">
        <?php?>
    </div>
</div>



当你的数字变大时，这将允许棕色框扩大。
试着去掉宽度：100px和添加display:inline block这就是您选择其他答案的原因吗无论如何，最小高度是一个基本的样式属性，也有两个最大版本。。。很好地限制了事情。
<div class="answers-wrapper">
    <div id="answers">
        <?php?>
    </div>
</div>