Win a copy of 97 Things Every Java Programmer Should Know this week in the Java in General forum!
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Paul Clapham
  • Jeanne Boyarsky
  • Junilu Lacar
  • Henry Wong
Sheriffs:
  • Ron McLeod
  • Devaka Cooray
  • Tim Cooke
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Frits Walraven
  • Tim Holloway
  • Carey Brown
Bartenders:
  • Piet Souris
  • salvin francis
  • fred rosenberger

Can someone help me make this PHP element to float left like the HTML elements are doing?

 
Greenhorn
Posts: 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
THIS IS HOW THE PHP LOOK LIKE: https://ibb.co/NFxMSdY
THIS IS HOW THE HTML LOOK LIKE: https://ibb.co/Y8z4dYv

THIS IS THE PHP CODE WITH CSS

<!doctype html>
<html>
<head>

<style>

* {
 box-sizing: border-box;
 }

.row {  
 display: -ms-flexbox; /* IE10 */
 display: flex;
 -ms-flex-wrap: wrap; /* IE10 */
 flex-wrap: wrap;
}

.column {
 float: left;
 width: 50%;
 margin: 0;
 padding: 1%;
 text-align: center;
}

.card {
 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 1);
 background-color: rgba(29, 53, 87, 1);
 width: 80%;
}

.container {
 padding: 20px 16px;
}

.container:after, .row:after {
 content: "";
 clear: both;
 display: table;
}

.title {
 color: #d9d9d9;
 font-size: larger;
}


</style>
</head>


<body>

<?php <br /> <br />    $tjener = "localhost"; <br />    $brukernavn = "root"; <br />    $passord = "root"; <br />    $database = "jobb"; <br />     <br />    $kobling = new mysqli($tjener, $brukernavn, $passord, $database); <br />     <br />    if ($kobling->connect_error) {
       die("Noe Gikk Galt: " . $kobling->connect_error);
   }
   
   $kobling->set_charset("utf8");
   
   $sql = "SELECT * FROM jobber ORDER BY jobber_id ASC";
   $resultat = $kobling->query($sql);

while ($rad = $resultat->fetch_assoc()) {
 $jobb_id = $rad["jobb_id"];
 $jobbnavn = $rad["jobbnavn"];
 $fulltnavn = $rad["fulltnavn"];
 $epost = $rad["epost"];
 $telefon = $rad["telefon"];
 $stilling = $rad["stilling"];
 $arbeidere = $rad["arbeidere"];
 $når = $rad["når"];
 $melding = $rad["melding"];
 

 echo "<div class='row'>";
echo "<div class='column'>";
echo "<div class='card'>";
echo "<div class='container'>";
echo "<h2>$jobbnavn</h2>";
echo "

$stilling

";
echo "

$melding

";
echo "<h4>Søk her:</h4>";
       echo "

<button class='button'>Kontakt</button>

";
     echo " </div>";
   echo "</div>";
 echo "</div>";
echo "</div>";
}

?>

</body>
</html>




THIS IS THE HTML CODE WITH CSS

<!DOCTYPE html>
<html>
<head>

<style>

* {
 box-sizing: border-box;
 }

.row {  
 display: -ms-flexbox; /* IE10 */
 display: flex;
 -ms-flex-wrap: wrap; /* IE10 */
 flex-wrap: wrap;
}

.column {
 float: left;
 width: 50%;
 margin: 0;
 padding: 1%;
 text-align: center;
}
.card {
 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 1);
 background-color: rgba(29, 53, 87, 1);
}

.container {
 padding: 20px 16px;
}

.container:after, .row:after {
 content: "";
 clear: both;
 display: table;
}

.title {
 color: #d9d9d9;
 font-size: larger;
}

</style>
</head>
<body>


<div class="row">
       <div class="column">
         <div class="card">
           
           <div class="container">
             <h2>test</h2>
             

test


             

test
test


             <h4>test</h4>
             

<button class="button">test</button>


           </div>
         </div>
       </div>
       <div class="column">
         <div class="card">
           
           <div class="container">
             <h2>test</h2>
             

test


             

test
test


             <h4>test</h4>
             

<button class="button">test</button>


           </div>
         </div>
       </div>
     </div>

   </body>
     </html>

 
The overall mission is to change the world. When you've done that, then you can read this tiny ad:
Devious Experiments for a Truly Passive Greenhouse!
https://www.kickstarter.com/projects/paulwheaton/greenhouse-1
    Bookmark Topic Watch Topic
  • New Topic