Почему моя кнопка не работает? Его не щелкает, не зависает ... ничего - PullRequest
Новая
       11

Почему моя кнопка не работает? Его не щелкает, не зависает ... ничего

0 голосов
/ 29 июня 2018

Пожалуйста, посмотрите на ссылку здесь:

http://finsfunding.com/funditnow/

перейдите вниз, где синяя кнопка говорит «получить предварительное одобрение» рядом с iphone x. Мне нужно знать, почему эта кнопка не работает, когда я успешно использую ее в других частях страницы и сайта (тот же класс, то же поведение).

Кроме того, прежде чем кто-либо предположит, я уже поиграл с примерно 1000 значениями z-index, так что это не так. Я озадачен тем, почему кнопка не работает.

Ответы [ 3 ]

0 голосов
/ 29 июня 2018

Измените #iPhoneText_Container на z-index: 1 и добавьте следующее к #iPhone_blue: 

position: relative;
z-index: 5;
0 голосов
/ 29 июня 2018

Если вы видите, что кнопка «Начать здесь» div находится вверху страницы (z-index высок для родительского div), то вы написали и, следовательно, эффект наведения на кнопку #ApplyNow_button: hover работает.

Но для предварительно утвержденной кнопки / div, даже если у вас есть стили наведения для кнопки div с кнопками (.steps-button: hover), это перехватывается другим элементом div на странице. 

<div class="steps-button" style="float: left">Get Pre-Approved</div>

Я заметил, что iPhoneText_Container находится ниже всех элементов div. Установите z-index для iPhoneText_Container равным 99999, что решит проблему. 

#iPhoneText_Container {
 float: left;
 position: absolute;
 margin: 150px 0 0 75px;
 z-index: 99999;
}

Или вы можете просто добавить ниже CSS к своим стилям. 

#iPhoneText_Container {
  z-index: 99999 !important;
}
0 голосов
/ 29 июня 2018

Если вы удалите z-index: -100 из #iPhoneText_Container, это решит проблему. Однако это испортит ваш телефон img. 

#iPhoneText_Container {
 float: left;
 position: absolute;
 margin: 150px 0 0 75px;
}

Обновление: Если вы удалите цвет фона: #FFFFFF; от #IphoneTextBlock это решит проблему 

#iPhoneTextBlock {
 width: 70%;
 padding: 20px;
 margin: 0 0 0 90px;
 font-family: 'Montserrat',! sans-serif important;
 position: ;
 border: solid 0px #000;
 -webkit-box-shadow: 0px 9px 22px -13px rgba(0,0,0,1);
 -moz-box-shadow: 0px 9px 22px -13px rgba(0,0,0,1);
 box-shadow: 0px 9px 22px -13px rgba(0,0,0,1);
}
...