Php CSS:在DIV中水平溢出

Php CSS:在DIV中水平溢出,php,html,css,scroll,overflow,Php,Html,Css,Scroll,Overflow,我正在开发一个包含表的应用程序​​按div。根据结果数据库填写div。 如下图所示 然而,如果我再把一个项目放在长凳上,只会打乱整个桌子。我要做的是水平放置一根杆,这样它就可以旋转它,这样就可以看到数据库中的其他项目,而不会弄乱结构 代码 CSS PHP 正如您在前一张图中所看到的,它有9个div类Vacina 如果我加一个div类Vacina最多,会把桌子弄得一团糟 我想插入的是9个以上的div类Vacina,导致背景div类包含所有div的宽度增加,但与图像保持相同的方式,只是水平放置一个滚

我正在开发一个包含表的应用程序​​按div。根据结果数据库填写div。 如下图所示

然而,如果我再把一个项目放在长凳上,只会打乱整个桌子。我要做的是水平放置一根杆,这样它就可以旋转它,这样就可以看到数据库中的其他项目,而不会弄乱结构

代码

CSS

PHP

正如您在前一张图中所看到的,它有9个div类Vacina

如果我加一个div类Vacina最多,会把桌子弄得一团糟


我想插入的是9个以上的div类Vacina,导致背景div类包含所有div的宽度增加,但与图像保持相同的方式,只是水平放置一个滚动条以显示整个div。

如果我理解正确,我会尝试以下方法:

加上

我替换了浮动:左;与:

也许这就是你要找的。 编辑: 好的,我从头开始构建了一个示例,但是使用javascript而不是php,我无法测试php atm:。 这有点混乱,但如果您愿意,应该可以用PHP编写代码。 如果你在这方面有困难,请告诉我。 编辑2: 只是为了让它出现在答案中,而不仅仅是它的注释中,最终的解决方案是:。

HTML+PHP

<?php
  include_once("sessao.php");

  if (!isset($_SESSION['funcionario']['cpfFuncionario'])) {
    header("Location:index.html");
  }

  else if($_SESSION['funcionario']['adicionarDireito'] == 0) {
    header("Location:funcionario.php");
  }

?>

<html>
  <head>
    <meta charset="utf-8">
    <script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
    <title>Vacina Digital - Cadastrar Vacinação</title>
    <script type="text/javascript" src="template/js/script.js"></script>
    <link rel="stylesheet" href="template/css/reset.css"> 
    <link rel="stylesheet" href="template/css/fonts.css"> 

    <style>

     body {
        background-color:  #fdfdfd;
        overflow-y: auto; 
      }


      #form {

            margin-left: 50px;
            padding-left: 7%;
            padding-top: 50px;
            padding-bottom: 10px;
            margin-right: 50px;
            border: 1px solid #0F935A;
            border-radius: 20px;
            -moz-border-radius: 20px;
            -webkit-border-radius: 20px;
            -moz-box-shadow: 2px 2px 2px #cccccc;
            -webkit-box-shadow: 2px 2px 2px #cccccc;
            box-shadow: 2px 2px 2px #cccccc;
      }

      #form h1 {
          text-align: center;
          margin-right: 150px;
          font-family: "RobotoCondensed";
          font-size: 30px;
      }


    </style>   












  </head>

  <body>

    <?php
        include_once 'menufuncionario.php';
    ?>


    <div id="form">
      <fieldset>
        <?php
            include_once("db.php");
            if(isset($_POST['cns'])) {
              $cns = $_POST['cns'];
              $_SESSION['paciente'] = $cns;
            }
            else{
              $cns = $_SESSION['paciente'];
            }
            $sql = "SELECT *, DATE_FORMAT(dataNascimento, '%d/%m/%Y') AS 'data' FROM  populacao WHERE codigoCns = ".$cns;

            $ds1=mysql_query($sql);

            if ($ds1) {
              if (mysql_num_rows($ds1) > 0) {



                  $sql2 = "SELECT * FROM vacinaaplicada WHERE codPaciente = ".$cns;
                  $ds2 = mysql_query($sql2);
                  $linha=mysql_fetch_assoc($ds2);


                  $linha2=mysql_fetch_assoc($ds1);
                  $data_nasc = $linha2['data'];

                  $data_nasc=explode("/",$data_nasc);
                  $data=date("d/m/Y");
                  $data=explode("/",$data);
                  $anos=$data[2]-$data_nasc[2];
                  if ($data_nasc[1] > $data[1]) {
                  $anos = $anos-1;
                  } if ($data_nasc[1] == $data[1]) {
                  if ($data_nasc[0] <= $data[0]) {
                  $anos = $anos;

                  } else {
                  $anos = $anos-1;

                  }
                  } if ($data_nasc[1] < $data[1]) {
                  $anos = $anos;
                  }

                  $data2=date("d/m/Y");
                  echo "<h1>Carteira de Vacinação - ".$linha2['nomeCrianca']."</h1>";
                  /*echo "

                  <div id='caderneta' style='margin-left:-6%'>
                  ";*/

                  include_once 'caderneta.php';
                  echo "







                  </div>";

              } else {
                  echo "<h1>CNS Inválido</h1><br><br>
                  <center><a href='javascript:window.history.go(-1)'><button  style='margin-left:-150px' class='button button-red' href='javascript:window.history.go(-1)'>Voltar</button></a></center>
                  ";
              }
            }


      ?>

    </div>




  </body>

</html>
卡德尔内塔

<html>
<head>

<link rel="stylesheet" href="template/css/fonts.css"> 
<style type="text/css">


    #fundo {
    min-width: 800px;
     display: block;
     overflow: scroll;
     overflow-y: hidden;
     margin-left: -3%;
     height: 550px; 

     white-space: nowrap;
    }




    #pinguim, .vacina, .dose, .aplicacao {
        width: 100px; 
        height: 90px; 
        background-color: #D3D3D3; 
        margin-top: 6px;
        margin-left: 6px;
        border-radius: 5px;

        position: relative;
        float: left;
    }




    #pinguim, .vacina {
        height: 50px;

    }

    .vacina, .dose{
        background: green;
        font-family: RobotoCondensed;
        font-size: 14pt;
        text-align: center;

        color: #ffffff;
    }

    .vacina{
        padding-top: -14px;
        line-height: 15px;
    }

    .dose, .aplicacao{
        margin-top: -32px;  
    }

    .dose{
        line-height: 29px; 
    }

    .aplicacao, .fonte {
        font-family: "RobotoLight";
        text-align: center;
    }









</style>
</head>
<body>
    <div id = "fundo">


    <div id = "pinguim">        
    </div>


    <?php
    include_once ("db.php");
    $sql = "SELECT nomeVacina FROM vacina ORDER BY cod";
    $ds1=mysql_query($sql);


    if ($ds1) {
        if (mysql_num_rows($ds1) > 0) {
            $x = 0;
            $k = 0;
            while($linha=mysql_fetch_assoc($ds1)) {
                $x++;

                if(!($linha['nomeVacina'] == "Outras")) {


                        echo "<div class='vacina' id='".$x."'>";
                        echo "<br>".$linha['nomeVacina'];
                        echo "</div>";

                }
            }


            for($i = 1; $i < 6; $i++) {
                echo "<br><br><br><br><br><br>";

                echo "<div class='dose'>";

                if($i == 4 || $i == 5) {
                    echo "<br>Reforco";
                }

                else {
                    echo "<br>Dose ".$i;
                }
                echo "</div>";



                $z=0;
                for($j = 1; $j <= $x; $j++) {

                    $sql2 = "SELECT DATE_FORMAT(dataAplicacao, '%d/%m/%Y') AS dataAplicacao, loteVacina, descricaoVacina FROM vacinaaplicada WHERE dose = ".$i." AND codigoVacina = ".$j." AND codPaciente = '".$cns."'";
                    $ds2=mysql_query($sql2);
                    $linha2=mysql_fetch_assoc($ds2);

                    $z++;
                    echo "<div class='aplicacao' id='".$z.$i."'>";

                    if($linha2 == "") {
                        echo "";
                    }

                    else {
                        echo "<div style='margin-top:10px;'>". $linha2['descricaoVacina']."<div class='fonte'><b>Data</b><br></div>". $linha2['dataAplicacao'] . "<div class='fonte'><b>Lote</b><br></div>".$linha2['loteVacina']."</div>" ;
                    }

                    echo "</div>";
                }
            }





            echo"</div>";











        }

    }




    ?>
    </div>

    </div>

</body>
</html>

在第一个帖子上添加的详细信息我在这里根本看不到任何s。他们在哪里?编辑:我明白了,降价处理器正在隐藏它们。当你发布帖子时,你应该检查它们,确保所有应该可见的东西都是可见的。您还应该提供一个实际HTML代码的示例,而不是让我们浏览您的PHP。在接收此表中的数据时,创建一个div类Vacina,将一个放在另一个旁边。然后,他在下面的一行上显示div级剂量,显示疫苗的剂量,并在该剂量疫苗旁边显示。如果没有应用Vacina,则填充空白div。OK,但您仍然应该提供显示问题的HTML。PHP代码在这里并不重要,因为这个问题是关于HTML表示的。还没有。我想做的是增加背景div的大小,但是如果没有这个大小,就看不见了。她会继续使用当前的div大小,但会放一个滚动条来查看div大小的其余部分。我真的不明白你想说什么,对不起。我以为你希望你的桌子对可见部分有一个固定的宽度,当桌子比可见部分宽时有一个滚动条,这样你就可以滚动桌子的其余部分。不是你想要的吗?这很奇怪,因为我可以用我在这里发布的内容来做。这里是同一张桌子的两张图片,一张是90%的缩放,另一张是100%的缩放。我想保持图像缩放90%,只需添加一个滚动条即可查看所有内容,而不与另一个div重叠。请提供文档的html代码好吗?没有它有点困难。
white-space: nowrap;
display: inline-block;
<?php
  include_once("sessao.php");

  if (!isset($_SESSION['funcionario']['cpfFuncionario'])) {
    header("Location:index.html");
  }

  else if($_SESSION['funcionario']['adicionarDireito'] == 0) {
    header("Location:funcionario.php");
  }

?>

<html>
  <head>
    <meta charset="utf-8">
    <script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
    <title>Vacina Digital - Cadastrar Vacinação</title>
    <script type="text/javascript" src="template/js/script.js"></script>
    <link rel="stylesheet" href="template/css/reset.css"> 
    <link rel="stylesheet" href="template/css/fonts.css"> 

    <style>

     body {
        background-color:  #fdfdfd;
        overflow-y: auto; 
      }


      #form {

            margin-left: 50px;
            padding-left: 7%;
            padding-top: 50px;
            padding-bottom: 10px;
            margin-right: 50px;
            border: 1px solid #0F935A;
            border-radius: 20px;
            -moz-border-radius: 20px;
            -webkit-border-radius: 20px;
            -moz-box-shadow: 2px 2px 2px #cccccc;
            -webkit-box-shadow: 2px 2px 2px #cccccc;
            box-shadow: 2px 2px 2px #cccccc;
      }

      #form h1 {
          text-align: center;
          margin-right: 150px;
          font-family: "RobotoCondensed";
          font-size: 30px;
      }


    </style>   












  </head>

  <body>

    <?php
        include_once 'menufuncionario.php';
    ?>


    <div id="form">
      <fieldset>
        <?php
            include_once("db.php");
            if(isset($_POST['cns'])) {
              $cns = $_POST['cns'];
              $_SESSION['paciente'] = $cns;
            }
            else{
              $cns = $_SESSION['paciente'];
            }
            $sql = "SELECT *, DATE_FORMAT(dataNascimento, '%d/%m/%Y') AS 'data' FROM  populacao WHERE codigoCns = ".$cns;

            $ds1=mysql_query($sql);

            if ($ds1) {
              if (mysql_num_rows($ds1) > 0) {



                  $sql2 = "SELECT * FROM vacinaaplicada WHERE codPaciente = ".$cns;
                  $ds2 = mysql_query($sql2);
                  $linha=mysql_fetch_assoc($ds2);


                  $linha2=mysql_fetch_assoc($ds1);
                  $data_nasc = $linha2['data'];

                  $data_nasc=explode("/",$data_nasc);
                  $data=date("d/m/Y");
                  $data=explode("/",$data);
                  $anos=$data[2]-$data_nasc[2];
                  if ($data_nasc[1] > $data[1]) {
                  $anos = $anos-1;
                  } if ($data_nasc[1] == $data[1]) {
                  if ($data_nasc[0] <= $data[0]) {
                  $anos = $anos;

                  } else {
                  $anos = $anos-1;

                  }
                  } if ($data_nasc[1] < $data[1]) {
                  $anos = $anos;
                  }

                  $data2=date("d/m/Y");
                  echo "<h1>Carteira de Vacinação - ".$linha2['nomeCrianca']."</h1>";
                  /*echo "

                  <div id='caderneta' style='margin-left:-6%'>
                  ";*/

                  include_once 'caderneta.php';
                  echo "







                  </div>";

              } else {
                  echo "<h1>CNS Inválido</h1><br><br>
                  <center><a href='javascript:window.history.go(-1)'><button  style='margin-left:-150px' class='button button-red' href='javascript:window.history.go(-1)'>Voltar</button></a></center>
                  ";
              }
            }


      ?>

    </div>




  </body>

</html>
<html>
<head>

<link rel="stylesheet" href="template/css/fonts.css"> 
<style type="text/css">


    #fundo {
    min-width: 800px;
     display: block;
     overflow: scroll;
     overflow-y: hidden;
     margin-left: -3%;
     height: 550px; 

     white-space: nowrap;
    }




    #pinguim, .vacina, .dose, .aplicacao {
        width: 100px; 
        height: 90px; 
        background-color: #D3D3D3; 
        margin-top: 6px;
        margin-left: 6px;
        border-radius: 5px;

        position: relative;
        float: left;
    }




    #pinguim, .vacina {
        height: 50px;

    }

    .vacina, .dose{
        background: green;
        font-family: RobotoCondensed;
        font-size: 14pt;
        text-align: center;

        color: #ffffff;
    }

    .vacina{
        padding-top: -14px;
        line-height: 15px;
    }

    .dose, .aplicacao{
        margin-top: -32px;  
    }

    .dose{
        line-height: 29px; 
    }

    .aplicacao, .fonte {
        font-family: "RobotoLight";
        text-align: center;
    }









</style>
</head>
<body>
    <div id = "fundo">


    <div id = "pinguim">        
    </div>


    <?php
    include_once ("db.php");
    $sql = "SELECT nomeVacina FROM vacina ORDER BY cod";
    $ds1=mysql_query($sql);


    if ($ds1) {
        if (mysql_num_rows($ds1) > 0) {
            $x = 0;
            $k = 0;
            while($linha=mysql_fetch_assoc($ds1)) {
                $x++;

                if(!($linha['nomeVacina'] == "Outras")) {


                        echo "<div class='vacina' id='".$x."'>";
                        echo "<br>".$linha['nomeVacina'];
                        echo "</div>";

                }
            }


            for($i = 1; $i < 6; $i++) {
                echo "<br><br><br><br><br><br>";

                echo "<div class='dose'>";

                if($i == 4 || $i == 5) {
                    echo "<br>Reforco";
                }

                else {
                    echo "<br>Dose ".$i;
                }
                echo "</div>";



                $z=0;
                for($j = 1; $j <= $x; $j++) {

                    $sql2 = "SELECT DATE_FORMAT(dataAplicacao, '%d/%m/%Y') AS dataAplicacao, loteVacina, descricaoVacina FROM vacinaaplicada WHERE dose = ".$i." AND codigoVacina = ".$j." AND codPaciente = '".$cns."'";
                    $ds2=mysql_query($sql2);
                    $linha2=mysql_fetch_assoc($ds2);

                    $z++;
                    echo "<div class='aplicacao' id='".$z.$i."'>";

                    if($linha2 == "") {
                        echo "";
                    }

                    else {
                        echo "<div style='margin-top:10px;'>". $linha2['descricaoVacina']."<div class='fonte'><b>Data</b><br></div>". $linha2['dataAplicacao'] . "<div class='fonte'><b>Lote</b><br></div>".$linha2['loteVacina']."</div>" ;
                    }

                    echo "</div>";
                }
            }





            echo"</div>";











        }

    }




    ?>
    </div>

    </div>

</body>
</html>