Php 如何在固定容器中添加滚动条

我想在购物车产品的固定容器中添加滚动条，这样当我在购物车中添加太多产品时，我可以通过向下滚动容器中的产品来轻松查看它

?>
    <div class="right_nav" >
        <div class="right_nav_top">
           Your Cart
        </div>
        <hr width="130px">

        <table width="167" border="0" cellpadding="0" cellspacing="0" style="font-size:12px; margin:5px; overflow:auto">
<?php

//iterate through the cart, the $product_id is the key and $quantity is the value

foreach($_SESSION['cart'] as $product_id => $quantity) { 

//get the name, description and price from the database - 
//this will depend on your database implementation.
//use sprintf to make sure that $product_id is inserted into the query as a number - 
//to prevent SQL injection

$sql = sprintf("SELECT 
    event_title, 
    event_desc, 
    price 
    FROM events 
    WHERE id = %d;",
    $product_id); 

$result = mysql_query($sql);

//Only display the row if there is a product 
//(though there should always be as we have already checked)

if(mysql_num_rows($result) > 0) {

list($name, $description, $price) = mysql_fetch_row($result);

$line_cost = $price * $quantity; //work out the line cost
$totals = $total + $line_cost; //add to the total cost

?>

<tr>
    <td colspan="3"><?php echo $name;?></td>
</tr>
<tr>
    <td width="31"><?php echo $quantity;?>x</td>
    <td width="59">&pound<?php echo $line_cost?></td>
    <td width="70">
        <a href="<?php Site_titte();?>/viewcart.php?action=add&id=<?php echo $product_id;?>" title="Add">
            <img src="<?php Site_titte();?>/images/addred.png" width="24" height="24" border="none">
        </a>
        <a href="<?php Site_titte();?>/viewcart.php?action=remove&id=<?php echo $product_id;?>" title="Remove">
            <img style="margin-bottom:6px;" src="<?php Site_titte();?>/images/icon_close.png"  border="none"></a></td>
</tr>

<?php }}?>

</table>

<?php

if(!isset($_SESSION['uid']))
    {$link="login.php";}
else
    {$link=Site_titte()."/order.php";}
                    ?>
<hr width="130px">
    <div class="total_main">
        <div class="total_p1">Total</div>
        <div class="total_p2">&pound<?php echo $total ?></div>
        <div class="clearfix"></div>
    </div>
    <br>
    <center>
        <a href="<?php echo $link;?>">
            <img src="<?php Site_titte();?>/images/btn_order.png" border="none" width="140" height="38">
        </a>
    </center>
</div>

<?php

    }
else {

?>           

<div class="right_nav2">
    <div class="right_nav_top2">
        Your Cart
    </div>
    <hr width="130px"> 
        <table border="0" cellpadding="0" cellspacing="5" style="font-size:14px; margin:5px;">     
            <tr>
                <td colspan="3">Your cart is empty.</td>
            </tr>

</table>

以下是容器的HTML代码

?>
    <div class="right_nav" >
        <div class="right_nav_top">
           Your Cart
        </div>
        <hr width="130px">

        <table width="167" border="0" cellpadding="0" cellspacing="0" style="font-size:12px; margin:5px; overflow:auto">
<?php

//iterate through the cart, the $product_id is the key and $quantity is the value

foreach($_SESSION['cart'] as $product_id => $quantity) { 

//get the name, description and price from the database - 
//this will depend on your database implementation.
//use sprintf to make sure that $product_id is inserted into the query as a number - 
//to prevent SQL injection

$sql = sprintf("SELECT 
    event_title, 
    event_desc, 
    price 
    FROM events 
    WHERE id = %d;",
    $product_id); 

$result = mysql_query($sql);

//Only display the row if there is a product 
//(though there should always be as we have already checked)

if(mysql_num_rows($result) > 0) {

list($name, $description, $price) = mysql_fetch_row($result);

$line_cost = $price * $quantity; //work out the line cost
$totals = $total + $line_cost; //add to the total cost

?>

<tr>
    <td colspan="3"><?php echo $name;?></td>
</tr>
<tr>
    <td width="31"><?php echo $quantity;?>x</td>
    <td width="59">&pound<?php echo $line_cost?></td>
    <td width="70">
        <a href="<?php Site_titte();?>/viewcart.php?action=add&id=<?php echo $product_id;?>" title="Add">
            <img src="<?php Site_titte();?>/images/addred.png" width="24" height="24" border="none">
        </a>
        <a href="<?php Site_titte();?>/viewcart.php?action=remove&id=<?php echo $product_id;?>" title="Remove">
            <img style="margin-bottom:6px;" src="<?php Site_titte();?>/images/icon_close.png"  border="none"></a></td>
</tr>

<?php }}?>

</table>

<?php

if(!isset($_SESSION['uid']))
    {$link="login.php";}
else
    {$link=Site_titte()."/order.php";}
                    ?>
<hr width="130px">
    <div class="total_main">
        <div class="total_p1">Total</div>
        <div class="total_p2">&pound<?php echo $total ?></div>
        <div class="clearfix"></div>
    </div>
    <br>
    <center>
        <a href="<?php echo $link;?>">
            <img src="<?php Site_titte();?>/images/btn_order.png" border="none" width="140" height="38">
        </a>
    </center>
</div>

<?php

    }
else {

?>           

<div class="right_nav2">
    <div class="right_nav_top2">
        Your Cart
    </div>
    <hr width="130px"> 
        <table border="0" cellpadding="0" cellspacing="5" style="font-size:14px; margin:5px;">     
            <tr>
                <td colspan="3">Your cart is empty.</td>
            </tr>

</table>

---

请帮助我在何处编辑以在此容器中添加滚动条

您可以添加overflow-y或overflow-x以实现此目的，具体取决于您要滚动的方向。我猜你想上下滚动。因此，当您的div的内容（产品）增加超过其限制时，就会出现一个滚动条。请参见下面的示例：

示例：

<!-- Scroll bar present but disabled -->
    <div style="width: 200px; height: 100px; overflow-y: scroll;">
        test
        </div>
    <!-- Scroll bar present and enabled -->        
        <div style="width: 200px; height: 100px; overflow-y: scroll;">
        test<br />
        test<br />
        test<br />
        test<br />
        test<br />
        test<br />
        test<br />
        test<br />
        test<br />
        test<br />
        </div>

测试
测试

测试

测试

测试

测试

测试

测试

测试

测试

测试

添加

---

到要使用滚动条的元素。

使用

溢出的演示：滚动真是一团糟，你应该试着只输入相关的代码，而不是你所有的。它太乱了，我甚至懒得去整理它。与答案无关，因为@HarryDenley给了你一个很好的答案，但在你的班上你有
style=max height:552px；
right\u nav\u top
；；宽度：150px；}删除
样式=
以及第二个
max height
规则之后加上code>。@Jack-它怎么与答案无关？他的问题是前两行，我给了他解决问题的“工具和诀窍”，这是一个答案。除非我漏掉了什么。@HarryDenley在我说“因为Harry Denley给了你一个好答案”之前，你肯定漏掉了“与答案无关”后面的逗号。我是说我的评论与答案无关，但你给出了一个好答案。别忘了用绿色复选标记将张贴的答案标记为已回答。
overflow:scroll