Question

我有一个我试图添加到我的网站的bootstrap购物车，问题是表格的第一行完美（四行到一行）然而第二行分割其结果，两个在一行上两个其他

我可以得到结果，每行显示两个没有任何错误。但我似乎无法将结果正确地形成四列。

可在此处找到指向该网站的链接http://www.deli-box.co.uk/deli6.php

HTML＆amp;网页中的PHP

<section class="products" data-image="">

<?php
//
// Show Product Grid 
//
if (isset($_GET['category'])) {
    $category = $_GET['category'];
} else {
    $category = 1;
} // list category from table bsc_category
$shoppingcart_vertical = 0; // if the is vertical shoppingcart_vertical=1 / is top or bottom are horitzontal -> shoppingcart_vertical=0
$_SESSION['LastProductPage'] = $_SERVER["REQUEST_URI"]; // take the name of this page for return
include "BootstrapShoppingCart/products_grid.php";  // list products 
//
// Show Product Grid 
//
?>                   

</section>

以下代码是构成结果的部分，是产品网格页面内容的一部分。我已经把sooe代码留了出来，但这只是查询，并且不认为它有任何影响。

<div class=".col-md-3" data-id="<?php echo $thisproduct[0]    ['id_product']; ?>" data-type="<?php
if (count($thisproduct)>1) {
    echo 'select'; // are selection/type? 
}
?>" data-quantity="1">
    <div class="thumbnail">
        <img src="assets/<?php echo $thisproduct[0]['img']; ?>" alt="<?php echo $thisproduct[0]['name']; ?>" class="img-responsive">
        <div class="caption">
            <p>
                <?php
                echo $thisproduct[0]['name'] . "<br />"; // display name product         
                $price = new getprice($rs['id'], 0); // first its id->product second id->type
                $price_array = $price->get(); // getting price [0] = no offer price [1]= offer price

                if (count($thisproduct)==1) { // its only 1 product or ... have types ?
                    if ($thisproduct[0]['price'] > 0) { // have price ?
                        if ($thisproduct[0]['offer']) { // this a offer ?
                            echo '<span class="price_overline">' . moneyformat($thisproduct[0]['price']) . '</span>';
                            echo '<span class="offer"> ' . moneyformat($thisproduct[0]['price_offer']) . '</span>';
                        } else {
                            echo '<span class="price">' . moneyformat($thisproduct[0]['price']) . '</span>';
                        }
                    } else {
                        echo '<span class="price">&nbsp;</span>'; // are price 0 then 
                    }
                } else {
                     echo '<span class="offer">&nbsp;</span>';
                }
                ?>   

            </p>
            <?php
            if (count($thisproduct)>1) {
                ?>
                <select class="form-control combobox_type" style="margin-bottom: 6px;">
                    <option value="select" selected>Select ...</option>
                    <?php foreach ($thisproduct as $type) { 
                        if ($type['id_type']>0) {
                        ?>
                        <option value="<?php echo $type['id_type']; ?>"><?php
                        echo $type['name_type']. ' ';
                        // its type w price ?                                                                   
                        // display price type ... like iphone 16gb/32gb/64/gb
                        if ($type['offer']) { // this a offer ?
                            echo '<span class="price_overline">' . moneyformat($type['price']) . '</span>';
                            echo '<span class="offer"> ' . moneyformat($type['price_offer']) . '</span>';
                        } else {
                            echo '<span class="price">' . moneyformat($type['price']) . '</span>';
                        }
                        ?></option>
                        <?php } // foreach types
                        } // its a type? ?>
                </select>
                <?php
            } else { // options 
                echo '<div style="height: 40px;"></div>';  // i make a offset
            }
            ?>

            <p align="center">
                <?php if ($shoppingcart_vertical) { ?>
                    <a href="#" class="btn btn-success addproduct"><i class="icon-shopping-cart"></i>Add</a>
                <?php } else { ?>
                    <a href="#" class="btn btn-success addproduct-horizontal"><i class="icon-shopping-cart"></i>Add</a>
                <?php } ?>
            </p>
        </div>
    </div>
</div>

Answer 1

~~对于初学者来说，您的HTML代码的第一行（.应该是<div class=".col-md-3"）的类属性中有一个额外的<div class="col-md-3"。~~

~~<击>~~

~~尝试纠正此问题，看看你是否获得了更好的结果......~~

尝试在<div class="row">标记中包装每一行。 Bootstrap会自动为每个col-*-*类添加填充，并且每个元素上的这一点额外填充可能会抛出对齐。 <div class="row">将对抗添加的填充，元素应该正确排列。

你应该得到一个类似于这样的行/列结构：

<div class="row">
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
</div>
<div class="row">
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
</div>
<div class="row">
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
    <div class="col-md-3">Content</div>
</div>

Mysql结果无法正确对齐

1 个答案: