CSS - 内图像位置按钮 [英] CSS - position button inside image

问题描述

我有一个包含图片的div，我需要放置一个按钮，在图​​像内围绕图片的右上角，当我做到这一点。

I have div that contains an image, I need to place a button inside the image to around the top right corner of the image, when I do this

#button_id{
position: relative;
    left: 270px;
    top: 30px;
}

这是做的是使按钮图像什么别的地方摆，它移动的图像从左向右和向下，但现在该按钮是点击能在酒吧从那里原本放在最右边的股利。当我尝试这种

What this is doing is making the button image be placed somewhere else, it moves the image left to the right and down, but the now the button is click-able in bar from where it was originally placed to the far right of the div. When I try this

#button_id{
     position: relative;
     float: right; padding: 0px -40px -15px;
}

它会将按钮的权利，但它不会动它。

it moves the button to the right but it won't move it down.

注意：该按钮是div里面，没有的CSS它是在中心放置在图象的顶部

Note: the button is inside the div, without the css it is placed on top of the image in the center

推荐答案

您应该给包含图像的DIV一个的位置是：相对和你的按钮包含内DIV一个的位置是：绝对。于相对于容器div按钮将使

You should give the div containing the image a position:relative and your button that is contained within that div a position:absolute. That will position the button relative to the container div.

这篇关于CSS - 内图像位置按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！