Poner un botón encima de un object

[ramondevesa]

Buenas, estoy trabajando con videos de Vimeo, entonces pretendo colocar un botón encima del video, con un enlace. Entonces mediante position:absolute lo he conseguido a poner. Lo que ahora ocurre es que cuando redimensiono el explorador se me descuadra el botón, por que yo quiero que el botón se encuentre a 10 px del margen derecho y a 10px del margen inferior, mi codigo actual es este.

Código CSS:

width: 204px;
        height: 65px;
                z-index: 1;
                position:absolute;
        box-shadow: 1px 1px 1px #cd8228;
        border-radius: 3px 3px;
                float:right;
                margin-right: 20px;
 

¿qué me recomiendan?

[pzin]

Puedes poner el vídeo dentro de un elemento con posición relativa, y dentro del mismo elemento poner tu botón con posición absoluta, y esa posición será relativa al contenedor. Algo así:

Código HTML:

<div class="video_contenedor">
  <object>vídeo</object>
  <a>botón</a>
</div>
 

Código CSS:

div.video_contenedor {
  position: relative;
}
 
div.video_contenedor a {
  position: absolute;
  right: 10px;
  bottom: 10px;
}
 

[ramondevesa]

Que va, con este código se me sale fuera del object

[pzin]

Con ese código realmente no sale. Se saldrá con el que estés usando tú que obviamente no será igual del todo al que puse yo.

Publica cómo lo tienes —HTML/CSS— a ver dónde está el error/fallo/cosaquenosehatenidoencuenta.

[ramondevesa]

Este es mi código HTML:

Código HTML:

<div class="video_contenedor">
    <object width="1004" height="500"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id={{ video.trailer }}&amp;force_embed=1&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=121414&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id={{ video.trailer }}&amp;force_embed=1&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=121414&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="1004" height="500"></embed>
    </object>
    <a href="#">
        <div id="compra">
            <div id="compra-euro">
            </div>
        <div id="compra-tiempo">
                <div class="alquilar_a">48 horas</div>
                <div class="alquilar_b">Alquilar</div>
            </div>
        </div>
    </a>                
</div>
 

Código CSS:

Código CSS:

video_contenedor {
  position: relative;
}
 

[pzin]

Tendría que ser:

Código CSS:

.video_contenedor {
 

Porque sino estarías seleccionando un elemento <video_contenedor> y no una clase.