Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 21.12.2016, 17:58
Аватар для Synth
Интересующийся
Отправить личное сообщение для Synth Посмотреть профиль Найти все сообщения от Synth
 
Регистрация: 16.10.2015
Сообщений: 16

Я не знаю, можно ли тут давать ссылки или нет. Надеюсь меня не забанят.

Вот тема wordpress: http://safreen.imonthemes.com/demo1/

Там под шапкой 3 блока WE DELIVER, WE FOCUS, WE`RE CREATIVE.

В демо шаблона, текста в блоках имеют одинаковое количество строк, поэтому кнопки одинаково расположены. Но если в каком-то из блоков будет больше(или меньше) текста, кнопка снизу станет ниже(или выше) и соответственно кнопки уже не будут в одну линию.

В примере всё работает, но когда пытаюсь применить пример в этой теме - не срабатывает.
Ответить с цитированием
  #12 (permalink)  
Старый 21.12.2016, 18:46
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

Synth,
Но на сайте у этих ссылок (которые кнопки) нет id. Как вы их ищете в DOM?
Посмотрите измененный Пост#9

Последний раз редактировалось Dilettante_Pro, 21.12.2016 в 18:57.
Ответить с цитированием
  #13 (permalink)  
Старый 21.12.2016, 19:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,071

Synth,
перед </head> добавить
<style type="text/css">
 .divider-single {
     flex: 1;
}
.inner{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.hvr-sweep-to-top-border {
  width: 160px;
  text-align: center;
}

</style>
</head>
Ответить с цитированием
  #14 (permalink)  
Старый 21.12.2016, 20:59
Аватар для Synth
Интересующийся
Отправить личное сообщение для Synth Посмотреть профиль Найти все сообщения от Synth
 
Регистрация: 16.10.2015
Сообщений: 16

Сообщение от Dilettante_Pro Посмотреть сообщение
Synth,
Но на сайте у этих ссылок (которые кнопки) нет id. Как вы их ищете в DOM?
Посмотрите измененный Пост#9
Да, там нет id в оригинальной теме. Я сам id добавлял.

Попробовал код из изменённого поста. Они сдвигаются, но все равно не срабатывает.

Сообщение от рони Посмотреть сообщение
Synth,
перед </head> добавить
<style type="text/css">
 .divider-single {
     flex: 1;
}
.inner{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.hvr-sweep-to-top-border {
  width: 160px;
  text-align: center;
}

</style>
</head>
Не сработало. Они сдвигаются немного и всё.
Ответить с цитированием
  #15 (permalink)  
Старый 21.12.2016, 21:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,071

Сообщение от Synth
Не сработало.
где можно увидеть это?
Ответить с цитированием
  #16 (permalink)  
Старый 21.12.2016, 23:29
Аватар для Synth
Интересующийся
Отправить личное сообщение для Synth Посмотреть профиль Найти все сообщения от Synth
 
Регистрация: 16.10.2015
Сообщений: 16

Сообщение от рони Посмотреть сообщение
где можно увидеть это?
Например, можно просто открыть демо темы: http://safreen.imonthemes.com/demo1/

Можно взять Firefox DevTools или Chrome DevTools, добавить ещё одну строку текста в первый блок, чтобы кнопка была ниже остальных. Потом добавить перед </head> ваш код css.
Ответить с цитированием
  #17 (permalink)  
Старый 22.12.2016, 01:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,071

Сообщение от Synth
Потом добавить
а нельзя сразу?
Ответить с цитированием
  #18 (permalink)  
Старый 22.12.2016, 02:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,071

Synth,
http://codepen.io/anon/pen/XNQXKv
Ответить с цитированием
  #19 (permalink)  
Старый 22.12.2016, 21:32
Аватар для Synth
Интересующийся
Отправить личное сообщение для Synth Посмотреть профиль Найти все сообщения от Synth
 
Регистрация: 16.10.2015
Сообщений: 16

Когда в теме в head вставляю:
.divider-single {
     flex: 1;
}
.inner{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.hvr-sweep-to-top-border {
  width: 180px;
  text-align: center;
}

Не срабатывает. Не понимаю, почему через codepen работает.
Ответить с цитированием
  #20 (permalink)  
Старый 22.12.2016, 21:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,071

Synth,
видимо на выходе вашего шаблона этого css нет или вставлено неправильно
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
размножить кнопки для сайта Anshag (X)HTML/CSS 3 26.11.2015 06:18
Анимация залипания кнопки SmilingDog Events/DOM/Window 14 22.12.2014 06:35
Сделать кнопки без действенными на время анимации FredIkO Общие вопросы Javascript 3 06.06.2013 13:39
Обновление события кнопки TheHappy Общие вопросы Javascript 0 06.03.2012 10:30
Получение ссылки на объект в обработчике нажатия кнопки pauluss ExtJS 1 22.06.2011 15:27