2014-04-20 135 views
2

我是初學者,希望得到一些幫助,看看我犯了什麼錯誤。 我喜歡這樣,名爲「經銷商」和「私人派對」的最後一個按鈕浮在圖片左側的iPhone圖片旁邊。 在此先感謝按鈕在圖像旁邊浮動的按鈕

Since I don't have enough reputation and can't post a picture. Here is a link to what the image of what my issue is [Image][1]

HTML:

<div class="recent-trade-img" style="margin:10px 0 0 0"> 
    <input class="sell-type" value="Dealer" type="button"><input class="sell-type" value="Private Party" type="button"> 
    <a href="prices_iPhone_2G_16GB_ATT.html"><img src="images/specs_iPhone_2G.jpg" width="186" height="182" alt=""/></a> 
    </div> 
    <div class="name"> 
    <a href="prices_iPhone_2G_16GB_ATT.html">iPhone 2G<br> 16GB AT&amp;T</a> 
    </div> 

CSS:

.sell-type { 
background-color: #ffffff; 
border: 1px solid #ccc; 
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset; 
color: #0564BC; 
/*text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8), 0 1px 2px rgba(0, 0, 0, 0.2);*/ 
border-radius: 4px 4px 4px 4px; 
cursor: pointer; 
font-weight: bold; 
padding: 5px 0; 
/*width:130px; 
height:58px;*/ 
width:100px; 
height:48px; 
margin: 4px; 
font-size: 14px; 
background-size:70% !important; 

} 

.sell-type:hover { 
border-color: #0564BC; 
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 1px 3px rgba(0, 0, 0, 0.1); 
color: #36658f; 
} 

回答

0

你要做的就是發生在一個div 2個按鈕和圖像在自己的div

<Div class="dealer_priv_btn"> 
Butons come here.... 
</div> 

<div class="the_image"> 
    Image tag comes here... 
</div> 

你的CSS現在應該是這樣的這兩個類

.dealer_priv_btn{float:left; width:100px; height:100px;} 
.the_image{float:left; width:100px; height:100px;} 

請聲明自己的大小,即寬度和高度..玩t帽碼使它適合你..

GOoDLucK :)

0

下面的代碼作品根據自己的需要修改它

HTML:

<div class="supreme container"> 
    <img src="the iphone.jpg" class="i-image"> 

    <div class="sub_container"> 
    <div class="button_deal">dealer</div 
    <div class="button_private_party">private party</div> 
    </div> 

</div> 

CSS

.supreme container{ 
display:inline-block 
} 

.i-image{ 
float:left; 
display:block; 
width:150px; 
height:150px; 
} 

.sub_container{ 
float:left; 
display:block 
}