I've been dealing with this problem like 3 days.
I have a PHP code that echo es images from database. The class IMG is not responding, it should show margin-bottom: 60px but it is not. I've putted the class in img class-name src but still nothing.
Thank you
<table class="table-image">
<?php
$query = "SELECT * FROM images ORDER BY id DESC";
$result = mysqli_query($connect, $query);
while($row = mysqli_fetch_array($result))
{
echo '
<tr>
<td>
<img src="data:image/jpeg;base64,'.base64_encode($row['name'] ).'" height="480" width="550" class="img" " />
</td>
</tr>
';
}
?>
</table>
And CSS
.img{
width: 100%;
height: auto;
margin-bottom: 60px;
}
You have two quotes at the end.
class="img" " />
<table class="table-image">
<?php
$query = "SELECT * FROM images ORDER BY id DESC";
$result = mysqli_query($connect, $query);
while($row = mysqli_fetch_array($result)): ?>
<tr>
<td>
<img src="data:image/jpeg;base64,<?php echo base64_encode($row['name'] ); ?>" height="480" width="550" class="img" />
</td>
</tr>
<?php endwhile; ?>
</table>
Related
Im trying to align the image that I fetched from my database with a text that is also fetched from database. The text seems ok but the image just stick to the left
<div align="center">
<p>
<?php
$vid =$_REQUEST[#id];
include 'conn.php';
$sql = mysql_query("SELECT * FROM product_car where Id = '$vid'");
$vid = 'Id';
$vnamaproduk = 'NamaProduk';
$vharga = 'Harga';
$vpenerangan = 'Penerangan';
$vgambar = 'Gambar';
?>
<table width="1000" border="0" align="center">
<?php
while($row= mysql_fetch_assoc($sql)){
?>
<tr>
<td>
<img src="gambar/car/<?php echo $row[$vgambar];?>"width="500" height="400"/>
</td>
<td>
<?php
echo "<br>Product Id : ".$row[$vid];
echo "<br>Product Name : ".$row[$vnamaproduk];
$harganew =sprintf('%0.2f',$row[$vharga]);
echo "<br>Price : RM".$harganew;
echo "<br> <br>".$row[$vpenerangan];
echo "<br>";
}
?>
ADD TO CART
</td>
</tr>
</table>
</div>
is the image displayed as a block?
img {
display:block;
margin:auto;
}
If you want to center the image, you could try this
img {
margin: auto 0;
}
When using CSS for my DetailsTable the information I am getting from the database is not being displayed correctly in the table. All of that information is getting bunched up together and therefore isn't being laid out as a table.
If anyone could suggest why the information I am trying to get isn't being laid out in a table form that would be much appreciated
</head>
<body>
<div id="DetailsTable" >
<table>
<tr>
<th>Name</th>
<th>TypeOfShoe</th>
<th>Description</th>
<th>Price(£)</th>
<th>Fabric</th>
<th>Colour</th>
<th>Brand</th>
</tr>
</table>
<?php
$shoesID=$_GET['id'];
$stmt = $conn->prepare("SELECT shoes.name, shoes.images, shoes.description, shoes.price, types.typeOfShoe, types.fabric, types.colour, brands.name AS bname FROM shoes INNER JOIN types on types.types_id = shoes.type_id INNER JOIN brands on brands.brands_id = shoes.brands_id
WHERE shoes.id = :id");
$stmt->bindValue(':id',$shoesID);
$stmt->execute();
if ($shoes=$stmt->fetch()){
echo "<td>".$shoes['name']."</td>";
echo "<td>".$shoes['typeOfShoe']."</td>";
echo "<td>".$shoes['description']."</td>";
echo "<td>".$shoes['price']."</td>";
echo "<td>".$shoes['fabric']."</td>";
echo "<td>".$shoes['colour']."</td>";
echo "<td>".$shoes['bname']."</td>";
}
$conn=NULL;
?>
<br> <br/>
<div id="Image" >
<img src="<?php echo $shoes['images']; ?>" height="500px" width="500px" />
</div>
</div>
The CSS code is below.
body {
background-color: lemonchiffon;
}
#DetailsTable {
border-collapse: collapse;
width: 100%;
}
th, td {
text-align: left;
padding: 8px;
}
#Image{
display: block;
margin: auto;
width: 50%;
height: 10px;
clear: both;
}
You have closed the</table> tag before the php code, that maybe the problem
</head>
<body>
<div id="DetailsTable" >
<table>
<tr>
<th>Name</th>
<th>TypeOfShoe</th>
<th>Description</th>
<th>Price(£)</th>
<th>Fabric</th>
<th>Colour</th>
<th>Brand</th>
</tr>
<?php
$shoesID=$_GET['id'];
$stmt = $conn->prepare("SELECT shoes.name, shoes.images, shoes.description, shoes.price, types.typeOfShoe, types.fabric, types.colour, brands.name AS bname FROM shoes INNER JOIN types on types.types_id = shoes.type_id INNER JOIN brands on brands.brands_id = shoes.brands_id
WHERE shoes.id = :id");
$stmt->bindValue(':id',$shoesID);
$stmt->execute();
if ($shoes=$stmt->fetch()){
echo '<tr>';
echo "<td>".$shoes['name']."</td>";
echo "<td>".$shoes['typeOfShoe']."</td>";
echo "<td>".$shoes['description']."</td>";
echo "<td>".$shoes['price']."</td>";
echo "<td>".$shoes['fabric']."</td>";
echo "<td>".$shoes['colour']."</td>";
echo "<td>".$shoes['bname']."</td>";
echo '</tr>';
}
$conn=NULL;
?>
</html>
<br> <br/>
<div id="Image" >
<img src="<?php echo $shoes['images']; ?>" height="500px" width="500px" />
</div>
</div>
so I would like in my registered users page, or members page all my users on it (that's the easy part) where i'm having trouble is I would like to have 2 users side by side, and then on the next line 2 other users and so on.
Something like this:
enter image description here
i'm using php and it's to use after a php query from mysql, this is my code at the moment:
<?php
include '_database/database.php';
session_start();
$current_user = $_SESSION['user_username'];
$sql = "SELECT * FROM users order by user_id desc";
$result = mysqli_query($database,$sql) or die(mysqli_error($database));
while($rws = mysqli_fetch_array($result)){
?>
<table style="width: 200px;">
<tbody>
<tr>
<td style="width: 100px;"><img src="userfiles/avatars/<?php echo $rws['user_avatar'];?>" width="100" height="100"></td>
<td style="width: 200px;">
<?php echo $rws['user_country'];?> <?php echo $rws['user_username'];?><br>
<?php echo $rws['user_joindate'];?><br>
1<br>
2<br>
3<br>
See more
</td>
</tr>
</tbody>
</table>
<?php } ?>
Thank you !
<?php
include '_database/database.php';
session_start();
$current_user = $_SESSION['user_username'];
$sql = "SELECT * FROM users order by user_id desc";
$result = mysqli_query($database,$sql) or die(mysqli_error($database));
?>
<div class="container" style="width: 200px;">
<?php while($rw = mysqli_fetch_array($result)){ ?>
<div class="user" style="width: 100px; float: left;">
<img src="userfiles/avatars/<?php echo $rw['user_avatar'];?>" width="100" height="100">
<div class="userInfo">
<?php echo $rw['user_country'] . ' ' . $rw['user_username'];?><br>
<?php echo $rw['user_joindate'];?><br>
<!--Content--><br>
<!--Content--><br>
<!--Content--><br>
See more
</div>
</div>
<?php } ?>
</div>
i haven't tested the code.
You also can use for design HTML, CSS and JS frameworks like Bootstrap
I want to show a category based shopping items with images on web page that can be found in the most Online shopping sites.I crated two mysql tables: Ist with id, category_name and 2nd with id, categoryid, product, image_path. I am able to display all product images at a time on page, but I don't know how to show product images of a single category selected from a dropdown list with submit button at the top of the page. I hope my point is clear to all otherwise feel free to ask me.
Below I attached my code that shows all the product images on my php page at a time without any dropdown list. Any ideas and advice on doing this is welcome.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
ul, li {
list-style-type:none;
}
ul.display {
width: 500px;
}
ul.display li {
float: left;
width: 100px;
height: 120px;
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
position: relative;
vertical-align:middle;
text-align:center;
}
ul.display li a img {
width: 94px;
height: 114px;
display: inline;
}
</style>
</head>
<body>
<div align="center">
<?php
include('connect.php');
$SQL = "SELECT * from becuart";
$result = mysql_query( $SQL );
echo "<ul class='display'>";
while( $row = mysql_fetch_array( $result ) ) {
$filepath = $row["path"];
echo "<li>";
echo "<img src=\"$filepath\" border=\"0\">";
echo "</li>";
}
echo "</ul>";
?>
</div>
</body>
</html>`
Because it's way too long -> new answer:
<?php
include 'dbconnect.php';
?>
<form name="product" method="post" action="">
<table align="right" width="10%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>Category</td>
<td>
<select name="category">
<?php
$sql = "SELECT id, art_name, path FROM category;";
$result = mysql_query($sql);
while ($row = mysql_fetch_assoc($result)) {
?>
<option value="<?= $row['id']; ?>"><?= $row['art_name']; ?></option>
<?php } ?>
</select>
</td>
</tr>
<tr>
<td> </td>
<td><input name="go" type="submit" value="Go" /></td>
</tr>
</table>
</form>
<div align="center">
<ul class='display'>
<?php
$id = (int)$_POST['category'];
$sql_search = "SELECT id, art_name, path FROM category WHERE id = $id";
$search = mysql_query($sql_search);
if (isset($_POST['go'])) {
while ($row = mysql_fetch_assoc($search)) {
?>
<li><img src="<?= $row['path']; ?>" border="0"></li>
<?php }
}
else {
}
?>
</div>
SELECT id, name, path FROM table;
...
<select name ...>
<?php
while( $row = mysql_fetch_array( $result ) ) {
?>
<option name="id" value="<?= $row['id']; ?>"><?= $row['name']; ?></option>
<?php
}
?>
</select>
So by javascript/jquery open the img which answers on the POSTed $row['id']; (SELECT path FROM table WHERE id = ?;) or by a simple $_POST['id'] which is the name of the field
By using the below code i displayed 9 images, but all images are align side by side, how to display the every 3 images in one row and another3 images in another row ?
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<?php $sel = $db->query("select * from gallery order by gallery_cat_id asc limit 1,1");
while($row=mysql_fetch_array($sel)){ ?>
<tr><td align="left" valign="top"><table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><?php $sel1 = $db->query("SELECT DISTINCT ( i.gallery_album_id )
FROM mov_gallery_album AS a, mov_gallery_images AS i
WHERE a.gallery_album_id = i.gallery_album_id
AND a.gallery_cat_id =".$row['gallery_cat_id']."
ORDER BY a.gallery_album_id DESC
LIMIT 0 , 9 "); if(mysql_num_rows($sel1)>0){ ?>
</tr><tr>
<?php
while($row1=mysql_fetch_array($sel1)){
$dis1 = $db->getRow("select * from ".ALBUMS." where gallery_album_id=".$row1['gallery_album_id']." limit 0,1");
$dis2 = $db->getRow("select * from ".GALLERY." where gallery_id=".$dis1['gallery_id']." limit 0,1");
$dis3 = $db->getRow("select * from ".ALBUMSIMAGES." where gallery_album_id=".$row1['gallery_album_id']." limit 0,1");
$dis4 = $db->getRow("select * from ".GALLERYCATEGORY." where gallery_cat_id=".$dis2['gallery_cat_id']." limit 0,1");
?>
<td align="left" width="100%"><table border="0" cellpadding="5" cellspacing="0">
<tbody><tr><td align="center" height="8" valign="middle" width="80">
<div style="border:0px;clear:both;padding-bottom:100px;margin-left:-110px;">
<div class="image_stack1"><a href="<?php echo SITE; ?>album/<?php echo ucfirst($dis1['gallery_cat_id']); ?>/<?php echo ucfirst($dis1['gallery_id']); ?>/<?php echo ucfirst($row1['gallery_album_id']); ?>/">
<img id="photo3" src="<?php echo SITE; ?>uploads/gallery/<?php echo $dis4['folder']; ? >/<?php echo $dis2['folder']; ?>/<?php echo $dis1['folder']; ?>/thumb/<?php echo $dis3['image']; ?>"width="80" height="80">
<div class="namehover1"><?php echo substr(ucfirst($dis1['name']),0,13); ?></div>
</a></div></div></td></tr></tbody></table></td><?php } ?></tr><tr><td class="midtitle" align="center" valign="middle"> </td></tr>
<tr><td style="padding-right: 10px;" align="right" colspan="4"><a href="<?php echo SITE; ?>gallery/<?php echo ucfirst($row['gallery_cat_id']); ?>/" class="midtitle">
<img src="http://www.img./viewall.png" border="0"/>
</a></td></tr><?php } ?></tbody></table></td></tr><?php } ?></tbody></table>
It would be wise to use div rather than table.
Some lines of css would do the trick. You wont have to logically determined to move to next line after 3 images. Here's how you can do with this in css
Lets have a div container for the all the images.
<style>
#photo_wrapper {
width:600px;
}
.photo {
width:150px;
height:150px;
display:block;
float:left;
border:6px #c5d0d6 solid;
margin-right:5px;
margin-bottom:5px;
overflow:hidden;
}
</style>
<div id="photo_wrapper">
<img src="image.jpg" class="photo"/>
<img src="image.jpg" class="photo"/>
<img src="image.jpg" class="photo"/>
<img src="image.jpg" class="photo"/>
<img src="image.jpg" class="photo"/>
<img src="image.jpg" class="photo"/>
</div>
this is generally done with the modulo (remainder after division) operator:
foreach ($results as $nr => $row) {
if (($nr % 3) == 0) echo '<tr>';
...
if (($nr % 3) == 0) echo '</tr>';
}
The concept is simple, use a counter and each time this counter MOD 3 is zero , start a new line.Or just count until 3 and reset the counter.
$i = 1;
while( $data = ....)
{
if($i == 1)
{
echo "<tr>"; //new line
}
echo "<td> .... </td>";
if($i == 3)
{
$i = 1;
echo "</tr>";
}
else
{
$i++;
}
}
//IMPORTANT! PLEASE NOTICE TO THIS PART: (OUT OF THE LOOP)
if($i < 3)
echo "</tr>";
you can put 9 photos in a div, then fix the width of that div to make it enough for only 3 photos in a line. And set float:left; for img tag in CSS.