用php和css在样式列表中显示MySQL数据库中存储的图像

我有几个图像存储在数据库中，我正试图在样式列表中显示这些图像。这个想法是，当我从数据库中调用图像时，php代码将在样式化的<div>元素内生成列表。。。不幸的是，事实并非如此。列表正在生成，但它没有遵循我的任何风格，图像也没有显示。

图片显示了页面上的边框宽度和高度，但中间缺少文件图标。。。当我转到数据库时，文件清楚地在那里，名称和所有内容。即使我输入file_display.php？id=1在URL的末尾会显示图像。。。

图像以jpeg格式保存在数据库中，除了LONGBOG数据之外的表格

以下是我获取图像并将其显示在列表中的代码：

    <div class="template_container">
    <h2>Templates</h2>  
    <ul style="margin: 0 50px;">
        <?php   
            // Grab the data 
            $sql = "select * from templates";
            $result = mysql_query($sql) or die ("Could not access DB: " . mysql_error());
            while ($row = mysql_fetch_assoc($result))
            {
                echo "<li>";
                echo "<a class='"caption" . "href='"cart.php?id=<?=" . $row['id'] . "&action=add>";
                echo "<img src='"http://URL-REMOVED.com/file_display.php?id=<?=" . $row['id'] . "'" alt='"'" /><br />";
                echo "<span>";
                echo "<big>" . $row['name'] . "<br />";
                echo $row['description'];
                echo "</span>";
                echo "</li>";
            }
        ?>
    </ul>
</div>

下面是应该为列表设置样式的css：

.template_container {
    width: 100%;
    height: auto;
    border-top: 1px solid #e8e8e8;
    margin: 75px auto 25px auto;
    padding-top: 25px;
}
.template_container h2 {
    font-family: 'Podkova', serif;
    font-size: 58px;
    line-height: 66px;
    color: #2d9dc8; font-weight: normal;
    text-transform: uppercase;
    letter-spacing: -2px; 
    text-align: center;
    margin-bottom: 50px;
}
.template_container ul li { 
    list-style-type: none; 
    display: inline; 
    text-align: center;
    zoom:1; 
    *display:inline;
}
.template_container ul { vertical-align: inherit; }
.template_container li { margin-left: 25px;}
.template_container img { 
    width: 180px;
    margin-bottom: 50px; 
    box-shadow: 0px 0px 10px #888;
    -moz-box-shadow: 0px 0px 10px #888;
    -webkit-box-shadow: 0px 0px 10px #888;
    -khtml-box-shadow: 0px 0px 10px #888;
}
a.caption { 
    position: relative !important;
}
a.caption span { 
    background: #000; 
    background: rgba(0,0,0,0.8); 
    color: white !important; 
    display: none; 
    padding: 5px 10px !important; 
    text-align: center; 
    position: absolute !important;
    bottom: 0 !important; 
    left: 0 !important; 
}
a.caption:hover {
    text-decoration: none;
}

对于那些想知道列表项中的<a class="caption">和<span>元素的人，我有一个javascript可以在悬停时显示这些元素。

更新：我发现了我的样式问题，我搞砸了，忘记关闭链接，我不小心在图像标签的末尾添加了一个<br />，使列表无法内联。

然而，我仍然无法看到我的图像。。。仍在寻找解决方案。。。