Изображение кнопки не отображается правильно

Я полный CSS/HTML noob. Я был бы очень признателен, если вы поможете мне.Изображение кнопки не отображается правильно

мне нужно исправить мою кнопку:

поля снижения активации (зависать) до фактического размера кнопки (без тени)
, когда я наведите курсор на кнопку, как избавиться от 1-го изображение левый overs?

СПАСИБО!

jsfiddle ссылка:

HTML:

<html> 
    <body> 
     <div> 
<a id="button" href="http://mysite.com"</a> 
      </div> 
     </body> 
    </html>

CSS:

div { 
    width: 820px; 
    height: 820px; 
    background: url('https://gator1174.hostgator.com/~mskparik/facebook/thx.jpg') 
} 

#button{ 
    display: block; 
    width: 204px; 
    height: 116px; 
    background: url(https://gator1174.hostgator.com/~mskparik/facebook/111.png) no-repeat top left; 
    position: absolute; 
    top: 90%; 
    left:10%; 
} 
#button:hover { 
    background: url(https://gator1174.hostgator.com/~mskparik/facebook/222.png) no-repeat top; 
    }

источник

2013-02-22 user2094727

Пожалуйста, попробуйте использовать лучшее название для вопросов. Текущий действительно не подходит. –

Пожалуйста, не используйте неприемлемый язык, даже если он частично подвергнут цензуре, он будет служить только для устранения ваших вопросов, ознакомьтесь с [FAQ] (http://stackoverflow.com/faq) для руководства по приемлемому поведению. –

Да, без проблем. Извините за это – user2094727

Я просто добавил угловую скобку, где это уместно, и, похоже, исправил обе проблемы. См. JSFiddle here.

<html> 
    <body> 
     <div> 
      <a id="button" href="http://mysite.com"></a> <!--Notice extra corner bracket--> 
     </div> 
    </body> 
</html>

источник

2013-02-22 17:01:21 George

Здесь сильное освещение ситакса действительно может вас спасти. Если это выглядит смешно, что-то не так. Даже в вашем примере скрипта все, что осталось после отсутствующего кронштейна, было КРАСНО. –

Большое спасибо !! Ты мне очень помог! – user2094727

Изображение кнопки не отображается правильно

ответ

Смежные вопросы