CODEWITHSUNDEEP
phphtmlcss
mastertrolable
mastertrolable

Reputation: 1

Displaying Text and Images In CSS

I have a database set up for Weapons for Sale and I have my PHP code here:

<?php

echo '<link rel="stylesheet" href="display.css" type="text/css">';

function FindPhoto($name)
{
    $dir_path = "http://www.chemicalzero.com/FireArms_Bis/Guns/";
    $extensions_array = array('jpg','png','jpeg');
    echo "<img src='$dir_path$name' style='width:100px;height:150px'>";
    echo "TESTING";
    echo "</div>"; 
}


$connection = mysql_connect('localhost', 'USER', 'PASSWORD');
mysql_select_db('DATABASE');

if(mysqli_connect_errno()){
    die("connection failed: "
    . mysqli_connect_error()
    . " (" . mysqli_connect_errno()
    . ")");
}

$query = "SELECT * FROM Guns"; //You don't need a ; like you do in SQL
$result = mysql_query($query);

echo "<table>"; // start a table tag in the HTML

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

   print 

   "<div id= 'item'>" .
   "<p>Make : ".$row["Make"]."</p>".
   "<p>Model: ".$row["Model"]."</p>".
   "<p>$".$row["Price"]."</p>".
   FindPhoto($row['Photo']);

}
echo "</table>"; //Close the table in HTML

mysql_close(); //Make sure to close out the database connection

My PHP displays all information from my database correctly and in the way I want it. The task comes when I incorporate the CSS code:

#item {
  width:100px;
  text-align:center;
  border: 5px solid #D9D9D9;
  padding: 0px;
  list-style: none;
  width: 150px;
  float: left;    
  margin-right: 15px;
  margin-bottom: 15px;
  border-radius: 10px;
  -moz-border-radius: 10px; /* firefox rounded corners */
  -webkit-border-radius: 10px; /* Safari rounded corners */
  min-height: 220px;
}

#item li h1 {
  text-align:center;
}

#item li#white {
   min-height: 220px;
}

The CSS code works fine except when I combine the two, I get one product that looks great and the other does not get included in the CSS. See picture: WEBSITE

How do I display the images correctly?

Upvotes: 0

Views: 62

Answers (2)

webjayant
webjayant

Reputation: 21

Your are not closing the "<div class="item">" after find image function. Add ."</div>" after FindPhoto($row['Photo']);

Upvotes: 1

Aman
Aman

Reputation: 640

You have not closed the div in print statement.

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

   print 

   "<div id= 'item'>" .
   "<p>Make : ".$row["Make"]."</p>".
   "<p>Model: ".$row["Model"]."</p>".
   "<p>$".$row["Price"]."</p>".
   FindPhoto($row['Photo']).
   // Here
   "</div>";

}`

Upvotes: 0

Related Questions