PHP Build a Basic PHP Website Listing and Sorting Inventory Items Displaying Item Details

Karn Sylvester
Karn Sylvester
10,345 Points

Item Details set below Featured Image

Hello everyone,

I'm wondering if someone can help me with this issue:

I have followed the implementation of code step-by-step but when when I preview the workspace the Item Details are set below the Featured Image.

I've looked through my code and can't see where the issue is. Here is a copy of my details.php code for reference. :

<?php 
include("inc/data.php");
include("inc/functions.php");

if (isset($_GET["id"])) {
  $id = $_GET["id"];
  if (isset($catalog[$id])) {
    $item = $catalog[$id];
  }
}

if (!isset($item)) {
  header("location:catalog.php");
  exit;
}

$pageTitle = $item["title"];
$section = null;

include("inc/header.php"); ?>

<div class="section page">

    <div class="wrapper">

      <div class="media-picture">

      <span>
        <img src="<?php echo $item["img"]; ?>" alt="<?php echo $item["title"]; ?>" />
      </span>

      <div class="media-details">

        <h1><?php echo $item["title"]; ?></h1>
          <table>

            <tr>
              <th>Category</th>
              <td><?php echo $item["category"]; ?></td>
            </tr>      
            <tr>
              <th>Genre</th>
              <td><?php echo $item["genre"]; ?></td>
            </tr>  
            <tr>
              <th>Format</th>
              <td><?php echo $item["format"]; ?></td>
            </tr>  
            <tr>
              <th>Year</th>
              <td><?php echo $item["year"]; ?></td>
            </tr>  
            <?php if (strtolower($item["category"]) == "books") { ?> 
            <tr>
              <th>Authors</th>
              <td><?php echo implode(", ",$item["authors"]); ?></td>
            </tr> 
            <tr>
              <th>Publisher</th>
              <td><?php echo $item["publisher"]; ?></td>
            </tr>  
             <tr>
              <th>ISBN</th>
              <td><?php echo $item["isbn"]; ?></td>
            </tr> 
            <?php } else if (strtolower($item["category"]) == "movies") { ?> 
            <tr>
              <th>Director</th>
              <td><?php echo $item["director"]; ?></td>
            </tr>
            <tr>
              <th>Writers</th>
              <td><?php echo implode(", ",$item["writers"]); ?></td>
            </tr> 
            <tr>
              <th>Stars</th>
              <td><?php echo implode(", ",$item["stars"]); ?></td>
            </tr> 
            <?php } else if (strtolower($item["category"]) == "music") { ?>
            <tr>
              <th>Artist</th>
              <td><?php echo $item["artist"]; ?></td>
            </tr>
            <?php } ?>
          </table>

     </div>

</div>

Moderator edited: Markdown added so that code renders properly in the forums.

1 Answer

Jennifer Nordell
STAFF
Jennifer Nordell
Treehouse Staff

Hi there, Karn Sylvester ! You're doing terrific! This has less to do with the actual PHP and more to do with the HTML and CSS side of things. Around line 26 you start a <div> with the class "media-picture", but you are missing the closing div on that. The closing div is supposed to be just before the start of the <div> with the class "media-details". Once I fix this, the details show to the right of the picture as expected.

Hope this helps! :sparkles:

Karn Sylvester
Karn Sylvester
10,345 Points

Thank you very much Jennifer, that was perfect :D