如何垂直顯示一組動態生成的按鈕

因此，我正在使用jQuery循環插件製作jQuery幻燈片。代碼如何垂直顯示一組動態生成的按鈕

部分產生幾個<input type="button">元素與1一個value到i（其中i等於幻燈片的總數）

我試圖讓他們出現在頂部的風格這些按鈕幻燈片中的圖像。我有這個部分確定。但是，它們在圖像上水平排列，我想在圖像上方垂直顯示它們。

我該如何去做這件事？

這是目前我的CSS是什麼樣子：

input[type=button] { 
    position: relative; 
    float: center; 
    padding: 10px; 
    left: 750px; 
    z-index: 1000; 

}

來源

2013-03-28 Mike Fisher

刪除。之前和之後在你的css – 2013-03-28 04:02:33

添加顯示：塊到您的CSS，根據我的答案下面.. – lukeocom 2013-03-28 04:17:11

替換此

input[type=button] { 
    position: relative; 
    float: center; 
    padding: 10px; 
    left: 750px; 
    z-index: 1000; 
}

這個

input[type=button] { 
    position: relative; 
    padding: 10px; 
    left: 750px; 
    z-index: 1000; 
}

不習慣float: center這是wrong property

加入display:block您輸入僅用於float: left和float: right;

更多Float

來源

2013-03-28 04:03:17

因此，除了漂浮。如何垂直而不是水平地製作按鈕陣容。 – 2013-03-28 04:06:55

給父母的文本對齊：中心 – 2013-03-28 04:08:43

我給你兩個例子首先是這個http://tinkerbin.com/Rpgu6FRf第二是這個http://tinkerbin.com/L8GuxtzR – 2013-03-28 04:11:42

可以達到的效果.. http://jsfiddle.net/NqN5y/6/

input[type=button] { 
    padding: 10px; 
    position: relative;  
    left: 350px; 
    z-index: 1000; 
    display:block; 
}

另一個簡單的辦法是在div中包含按鈕。爲div和賓果設置固定寬度。

http://jsfiddle.net/NqN5y/1/

<div id="buttons"> 
<input type="button" value="1"/> 
<input type="button" value="2"/> 
<input type="button" value="3"/> 
<input type="button" value="4"/> 
</div>

input[type=button] { 
    position: relative; 
    float: center; 
    padding: 10px; 
    left: 350px; 
    z-index: 1000; 
} 

#buttons{width:50px;}

然後，您可以將您的位置樣式的div容器.. http://jsfiddle.net/NqN5y/5/

input[type=button] { 
    padding:10px; 
} 

#buttons{width:50px;background-color:#afa; 
    position: relative; 
    left: 350px; 
    z-index: 1000; 
}

來源

2013-03-28 04:08:11 lukeocom

如何垂直顯示一組動態生成的按鈕

回答

相關問題