div 태그의 요소 얻기 인라인

Question

다음 PHP 스크립트는 데이터베이스에서 데이터를 검색하고 웹 페이지에 표시하는 데 사용됩니다! div 태그를 사용했지만 인라인으로 표시하는 방법을 모릅니다. 어떻게 할 수 있습니까?

<?php 
       require("includes/db.php"); 

       $sql="SELECT * FROM `order` "; 
       $result=mysqli_query($db,$sql); 


    echo"<div style='width:50px'>"; 
    echo "Order No."; 
    echo"</div>"; 
    echo"<div style='width:50px'>"; 
    echo "NIC no"; 
    echo"</div>"; 
    echo"<div style='width:50px'>"; 
    echo "Delivery/Pickup"; 
    echo"</div>"; 
    echo"<div style='width:50px'>"; 
    echo "Address"; 
    echo"</div>"; 
    echo"<div style='width:50px'>"; 
    echo "Expect time"; 
    echo"</div>"; 
    echo"<div style='width:50px'>"; 
    echo "Telephone"; 
    echo"</div>"; 
    echo"<div style='width:50px'>"; 
    echo "Email"; 
    echo"</div>"; 
    echo"<div style='width:100px'>"; 
    echo "Prescription-1"; 
    echo"</div>"; 
    echo"<div style='width:100px'>"; 
    echo "Prescription-2"; 
    echo"</div>"; 
    echo"<div style='width:100px'>"; 
    echo "Prescriptions-3"; 
    echo"</div>"; 



    while($row=mysqli_fetch_array($result)) 
    { 

     echo"<div style='width:50px'>"; 
     echo $row["OrderNo."]; 
     echo"</div>"; 
      echo"<div style='width:50px'>"; 
     echo $row["NIC"]; 
     echo"</div>"; 
      echo"<div style='width:50px'>"; 
     echo $row["DP"]; 
     echo"</div>"; 
      echo"<div style='width:50px'>"; 
     echo $row["Address"]; 
     echo"</div>"; 
      echo"<div style='width:50px'>"; 
     echo $row["DPTime"]; 
     echo"</div>"; 
      echo"<div style='width:50px'>"; 
     echo $row["Telephone"]; 
     echo"</div>"; 
      echo"<div style='width:50px'>"; 
     echo $row["Email"]; 
     echo"</div>"; 
     echo"<div style='width:100px'>"; 
     echo '<a href='.($row['Image1']).' >'; 
     echo "<img src='" .$row['Image1']. "' height='200' width='200'/>"; 
     echo "</a>"; 
     echo"</div>"; 


     echo"<div style='width:100px'>"; 
     echo '<a href='.($row['Image1']).' >'; 
     echo "<img src='" .$row['Image1']. "' height='200' width='200'/>"; 
     echo "</a>"; 
     echo"</div>"; 

     echo"<div style='width:100px'>"; 
     echo '<a href='.($row['Image1']).' >'; 
     echo "<img src='" .$row['Image1']. "' height='200' width='200'/>"; 
     echo "</a>"; 
     echo"</div>"; 
    } 
     ?> 

또한 별도의 줄에 while 루프 다음에 줄 집합을 표시하고 싶습니다! 내가 어떻게 할 수 있니?

Answer 1

아래 예와 같이 지정된 CSS 스타일로 적절한 컨테이너 요소를 사용하여 원하는 레이아웃을 만들 수 있습니다. 그러나 레이아웃은 부모 div에 할당 된 너비의 두 배인 이미지의 명시적인 크기 때문에 중단됩니다. CSS로 이미지 크기를 제어하는 ​​것이 더 쉬울 수도 있습니다.

<style type='text/css'> 
    #headers, 
    .row{ 
     width:auto; 
     float:left; 
     clear:both; 
     display:block; 
     margin:0; 
     padding:0; 
     box-sizing:border-box; 
     font-size:0.7rem; 
    } 
    #headers > div{ 
     background:black; 
     color:white; 
    } 
    #headers > div, 
    .row > div { 
     display:inline-block; 
     border:1px dotted black; 
     clear:none; 
     float:left; 
     margin:0; 
     box-sizing:border-box; 
     width:50px; 
     height:1.5rem; 
    } 
    .w100{width:100px;} 
</style> 


<?php 
    require("includes/db.php"); 

    $sql="SELECT * FROM `order` "; 
    $result=mysqli_query($db,$sql); 


    echo" 
    <div id='headers'> 
     <div>Order No.</div> 
     <div>NIC no</div> 
     <div>Delivery/Pickup</div> 
     <div>Address</div> 
     <div>Expect time</div> 
     <div>Telephone</div> 
     <div>Email</div> 
     <div class='w100'>Prescription-1</div> 
     <div class='w100'>Prescription-2</div> 
     <div class='w100'>Prescriptions-3</div> 
    </div>"; 



    while($row=mysqli_fetch_array($result)){ 

     echo" 
     <div class='row'> 
      <div>{$row['OrderNo.']}</div> 
      <div>{$row['NIC']}</div> 
      <div>{$row['DP']}</div> 
      <div>{$row['Address']}</div> 
      <div>{$row['DPTime']}</div>' 
      <div>{$row['Telephone']}</div> 
      <div>{$row['Email']}</div> 
      <div class='w100'> 
       <a href='{$row['Image1']}' > 
        <img src='{$row['Image1']}' height='200' width='200'/> 
       </a> 
      </div> 
      <div class='w100'> 
       <a href='{$row['Image1']}' > 
        <img src='{$row['Image1']}' height='200' width='200'/> 
       </a> 
      </div> 
      <div class='w100'> 
       <a href='{$row['Image1']}'> 
        <img src='{$row['Image1']}' height='200' width='200'/> 
       </a> 
      </div> 
     </div>"; 
    } 
?> 

Answer 2

div 대신 결과에 <table> 태그를 사용하십시오. 각 루프는 <tr>이고 값은 <td>입니다.