Бесплатная помощь по верстке
Страницы: Пред. 1 ... 18 19 20 21 22 След.
[ Закрыто ] Бесплатная помощь по верстке, Новичкам
Цитата
Kachok_cs пишет:
У меня простой вопрос.
 
Стоит запрет на просмотр кода. 
Извините, убрал запрет.
Настя Буланова, обратитесь к нему, тут то зачем?) Или это скрытая реклама?

Kachok_cs, да надо создать отдельный блок с количеством итемов равным плитке и все будет в ажуре) Либо задать высоту и текст опустить вниз.
Mamikonars, спасибо что помогаете в моей ветке +1 к карме)
Цитата
Kachok_cs пишет:
У меня простой вопрос.
Вот сайт: massagist.top
На нем мне нужно в одну линию чтобы через флекс бокс автоматом ровнялись эти блоки там где просмотры и подробнее в 1 ряд. Не как не могу сделать.
Это возможно?


Цитата
Kachok_cs пишет: 
У меня простой вопрос. 
Вот сайт: massagist.top 
На нем мне нужно в одну линию чтобы через флекс бокс автоматом ровнялись эти блоки там где просмотры и подробнее в 1 ряд. Не как не могу сделать. 
Это возможно? 

Возможно:
Код
.flex-element {
   display: flex;
   order: 0;
   flex: 1 150px;
   flex-flow: column nowrap;
}

.article-title {
   margin-bottom: auto;
}
Изменено: Oleg - 7 Апреля 2018 18:21
Цитата
Oleg пишет:
Цитата
Kachok_cs пишет:
У меня простой вопрос.
Вот сайт: massagist.top
На нем мне нужно в одну линию чтобы через флекс бокс автоматом ровнялись эти блоки там где просмотры и подробнее в 1 ряд. Не как не могу сделать.
Это возможно?

Возможно:
Код
 .flex-element {
   display: flex;
   order: 0;
   flex: 1 150px;
   flex-flow: column nowrap;
}

.article-title {
   margin-bottom: auto;
} 
Внатуре помогло)) Вотето уровень:). Спасибо большое ребята) Сам бы не додумался(
Всех с праздником!
Спасибо:)

Ребята, снова тот же вопрос. Только немножко другой.
Можно ли так сделать чтобы всегда по 3 ряда было и не сбивалось при разных разрешениях и не съезжало как в данном случае?
http://prostir.in.ua/zamovnyky/ Вот страница.
В данном случае Forshtag стоит сам в ряду, а хочется чтобы всё было красиво один за одним и в ряду по 3 было.

Что можно сделать?
Цитата
Kachok_cs пишет:
Можно ли так сделать чтобы всегда по 3 ряда было и не сбивалось при разных разрешениях и не съезжало как в данном случае?
prostir.in.ua/zamovnyky/ Вот страница.
В данном случае prostir.in.ua/zamovnyky/forshtag/]Forshtag стоит сам в ряду, а хочется чтобы всё было красиво один за одним и в ряду по 3 было.

Что можно сделать?
Самое простое - сделать одинаковым размер всех картинок. А так, можно задать фиксированную высоту контейнера с картинкой. Например, так:

Код
.article-image.work-image > a {display: block; height: 150px; overflow: hidden;}
Это для десктопной версии. Для различных разрешений нужно прописать медиа-запросы типа такого:
Код
 @media (min-width: 768px;) and (max-width: 1199px;) {
.article-image.work-image > a {height: 120px;}
}
Для ещё меньших экранов нужно определить контрольные точки и подобрать медиа-запросы и переопределить количество в ряд. Например, на экране 480-640 рх лучше сделать блоки в 2 колонки, а меньше 480 рх уже есть смысл сделать в одну колонку.

Вместо .article-image.work-image > a возможно будет достаточно .article-image > a или .work-image > a просто я не знаю не использу.тся ли данные классы где-то ещё.
Цитата
UserMix пишет:
Цитата
Kachok_cs пишет:
Можно ли так сделать чтобы всегда по 3 ряда было и не сбивалось при разных разрешениях и не съезжало как в данном случае?
prostir.in.ua/zamovnyky/ Вот страница.
В данном случае prostir.in.ua/zamovnyky/forshtag/]Forshtag стоит сам в ряду, а хочется чтобы всё было красиво один за одним и в ряду по 3 было.

Что можно сделать?
Самое простое - сделать одинаковым размер всех картинок. А так, можно задать фиксированную высоту контейнера с картинкой. Например, так:
Код
 .article-image.work-image > a {display: block; height: 150px; overflow: hidden;} 
Это для десктопной версии. Для различных разрешений нужно прописать медиа-запросы типа такого:
Код
  @media (min-width: 768px;) and (max-width: 1199px;) {
.article-image.work-image > a {height: 120px;}
} 
Для ещё меньших экранов нужно определить контрольные точки и подобрать медиа-запросы и переопределить количество в ряд. Например, на экране 480-640 рх лучше сделать блоки в 2 колонки, а меньше 480 рх уже есть смысл сделать в одну колонку.

Вместо .article-image.work-image > a возможно будет достаточно .article-image > a или .work-image > a просто я не знаю не использу.тся ли данные классы где-то ещё.
Спасибо большое. Я сам бы не справился. Трудно мне с версткой:( Мне очень помогло. Правильно я сделал? Добавил на разных разрешениях))
Ребята. Снова что-то не так сделал наверное. Я перенес весь этот код в поиск.
Прописываю в поиске:

Поліграф

Этот код, который нормально в разделах работает:

.article-image.work-image > a {display: block; height: 150px; overflow: hidden;}


@media (min-width: 768px;) and (max-width: 1199px;) {
.article-image.work-image > a {height: 120px;}
}

В поиске снова чтото не так. Разве я не так сделал что-то?
Цитата
Kachok_cs пишет:
В поиске снова чтото не так. Разве я не так сделал что-то?
Тут названия в несколько строк из-за чего блоки снова разной высоты. Можно задать фиксированную высоту и названию (или всему контейнеру), но с таким разбросом 1-3 строки будет смотреться не очень. Лучше уменьшить шрифт чтобы название было не больше двух строк:
Код
.article-image.work-image h2 {font-size: 18px; height: 42px;}
На меньших разрешениях нужно будет уменьшить шрифт и высоту блока (добавить строку в прощлый медиа-запрос). Например, так:
Код
  @media (min-width: 768px;) and (max-width: 1199px;) {
.article-image.work-image > a {height: 120px;}
.article-image.work-image h2 {font-size: 16px; height: 38px;}
 } 
Ну и в остальные, соответственно.
UserMix, спасибо что помогаешь) +1
Rustam Alimov, сначала думал тема авторская, но потом увидел, что ты не против посторонних советов и решил тоже добавить свои 5 копеек smile:o
Страницы: Пред. 1 ... 18 19 20 21 22 След.
Похожие темы:
Читают тему (гостей: 1, пользователей: 0, из них скрытых: 0)
Новые темыОбъявленияСвободное общение
17:15 WB и Ozon - новые "русские поисковики"? Яндекс теряет коммерческую выдачу 
17:10 Adsense личный опыт 
17:09 Яндекс Нейро и выдача в 2026 - остались ли лазейки для маленьких сайтов? 
23:22 Рост эффективности моего интернет‑магазина 
22:07 С чего сейчас проще начать? 
22:02 как оплатить claude и gpt-5 из рф в 2026 чтобы не забанили через три дня 
21:36 Трафик в минус, соцсети в топе - Завершено февральское обновление Google Discover 
14:27 1obmen.net - обмен криптовалют: выплаты в USD, EUR, GBP, CAD, CNY 
13:22 Продам аккаунты Gmail USA IP | Gmail MIX IP | Outlook Old 
12:39 Monitex: Мониторинг с кэшбэком 80% в USDT 
12:21 garantcoin.io - быстрый и надёжный сервис обмена криптовалюты GarantCoin 
10:37 Русские народные сказки - оцените! 
09:01 Мониторинг обменников Сrypto-scout.io 
04:32 От $0.015 за IP | $0.68 за ГБ | 9PROXY.COM | 20+ млн резидентных прокси | 99,95% аптайм | Без чёрных списков 
17:13 Чак Норрис ушел - 19 марта 2026, 86 лет, семья подтвердила 
16:59 Список обновленных тем пуст... 
22:55 С юмором по жизни! 
22:19 8 марта: желаю аптайма 99.9% и e-e-a-t без локов 
21:16 Почему не обновляется счетчик ИКС (индекса качества сайта) 
19:57 молодильные яблоки и живая вода 
01:50 Точные прогнозы на футбол