2013-07-16 5 views
0

Я пытаюсь вставить кликабельное изображение в заголовок, чтобы сидеть в правом нижнем углу. Я прочесывал ваши прошлые вопросы и добрался до этого, проводя то, что уже опубликовано. Тем не менее, я могу получить либо стиль работы с этим кодом без правильной привязки:Clickable Image in Header

header { 

<style> 
div#button 
    { 
    position:relative; 
    align:right; 
    top:111px;left:640px; margin:0;width:100%; 
    padding-bottom:25px; 
    } 

</style> 

***position is right, but linkage is wrong*** 
<div id="button"> 
    <a href="0379a5a.netsolhost.com/wordpress1/products/products-page/" > 
<img src="http://0379a5a.netsolhost.com/wordpress1/wp-content/uploads/2013/07/shop_now2.png" height="80.5x" width="163.5px" 
<div style="float:right;margin-top: 111px; margin-right: 50px; padding-bottom:16px;" 

/></a> 
</div> 

Но ссылка не будет работать. Я могу получить ссылку на работу, но потом стиль уходит с этим кодом:

<style> 
div#shop_now_button 
    { 
    position: relative; 
    float: right; 
    margin-top: 111px; 
    margin-left: 640px; 
    margin-right: 50px; 

    width:100%; 
    padding-bottom:25px; 
    } 

</style> 


<div id="shop_now_button"> 
<div style="float:right;margin-top: 111px; margin-right: 50px; padding-bottom:16px;"> 
<a s href="http://0379a5a.netsolhost.com/wordpress1/product/products-page/" target="_blank"> 
<img src="http://0379a5a.netsolhost.com/wordpress1/wp- content/uploads/2013/07/shop_now2.png" 
height="80.5px" 
    width="163.5px" 
float="right" 
margin-top="111px" 
margin-right="50px" 
padding-bottom="16px" /> 
    </div> 

Я просто хочу знать, что происходит. Я был устранение проблем в течение нескольких часов теперь ... (прошу прощения, если ее простое решение - я новичок в этом), это мой домен тщеславие ... http://0379a5a.netsolhost.com/wordpress1/

+0

Пожалуйста, добавьте [jsFiddle] (http://www.jsfiddle.net/) – screenmutt

+2

Простите, но этот код является полной катастрофой. Попробуйте дважды проверить свой синтаксис для стартеров. –

+0

'top' и' left' не совпадают с 'margin-top' и' margin-left' –

ответ

0

использование:

.header {position: relative;} 
.header img {positon: absolute; bottom: 0; right: 0;}