從兩列顯示mysql的數據

我打電話從mysql從一個表中，這是顯示在一列中，我希望數據在兩列中彼此相鄰。你可以在www.urimsopa.com 從兩列顯示mysql的數據

這是我的代碼。

$results = $mysqli->query("SELECT * FROM main_menu ORDER BY MenuID ASC"); 
    if ($results) { 

     //fetch results set as object and output HTML 
     while($obj = $results->fetch_object()) 
     { 
      echo '<div class="product">'; 
      echo '<form method="post" action="model/cart_update.php">'; 
      echo '<div class="product-content"><h2>'.$obj->Title.'</h2>'; 
      echo '<div class="product-thumb"><img width=400 height=300 src="uploads/'.$obj->Photo.'"></div>'; 
      echo '<div class="product-info">'; 
      echo 'Price '.$currency.$obj->Price.' | '; 
      echo 'Qty <input type="text" name="product_qty" value="1" size="5" />'; 
      echo '<button class="add_to_cart">Add To Cart</button>'; 
      echo '</div> 
      </div>'; 
     echo '<input type="hidden" name="product_code" value="'.$obj->MenuID.'" />'; 
      echo '<input type="hidden" name="type" value="add" />'; 
      echo '<input type="hidden" name="return_url" value="'.$current_url.'" />'; 
      echo '</form>'; 
      echo '</div>';

謝謝。

來源

2014-03-26 user3195317

如果您向我們展示您期望的輸出，這將有所幫助。試試[this]（http://stackoverflow.com/questions/5645986/two-column-layout-using-divs） – Hameed

它的CSS問題改變你的styles.css

線781

#products-wrapper { 
float: left; 
font: 12px Arial,Helvetica,sans-serif; 
margin-bottom: 10px; 
margin-left: 10px; 
margin-top: 10px; 
position: relative; 
width: 100%; 
}

線791

.products { 
float: left; 
margin-right: 10px; 
width: 100%; 
}

，並從代碼中刪除所有< BR/>標籤

來源

2014-03-27 07:14:18

謝謝。遲迴復。我如何獲得他們之間的差距增加？ http://urimsopa.com/index.php?p=Default_index – user3195317

我認爲你的問題是CSS不是mysql，如果你每次拉下while循環創建一個新對象時，都需要將每個對象浮動到左邊，然後它們應該適合放置。

所以儘量

.product {float:left};

來源

2014-03-26 23:12:22 Crizly

.product .product-content {0} {0} float：left; \t } – user3195317

它已經左移了。 – user3195317

你可以粘貼你的CSS（我已經有這樣的問題噸這樣的div只是不會正確漂浮：P）？ – Crizly

你必須重建的許多方面。

您的產品包裝寬度爲640px。並且您的單個產品框寬度爲434px。因此，請考慮減小該寬度以及圖像寬度，或者增加包裝寬度超過870像素以提供足夠的空間來並排保留2個盒子。

您的.products類有float:left;這是不必要的。將產品類放到左邊。

.product { 
    float: left; 
    display: inline-block; 
}

記得清楚：both;在.products塊之後。

來源

2014-03-26 23:25:02 effone

從兩列顯示mysql的數據

回答

相關問題