Здравствуйте, суть следующая, есть 2 блока в конце каждой статьи "Реклама от яндекса" и "Похожие темы" нужно подогнать по стилю блок "похожие темы" под блок "Реклама яндекс" что бы выглядело как один блок.
Кто чем сможет помочь, помогите.
В данной случае рассматриваю эту страницу http://gaz-autoclub.ru/lifegaz/2015/08/ ... hitelnaya/ внизу.
Кто чем сможет помочь, помогите.
В данной случае рассматриваю эту страницу http://gaz-autoclub.ru/lifegaz/2015/08/ ... hitelnaya/ внизу.
Комментарии: 47
- solo
- Сообщения: 37
- Зарегистрирован: 29 янв 2017, 14:53
- Пол: Муж
Спасибо, получилось
- solo
- Сообщения: 37
- Зарегистрирован: 29 янв 2017, 14:53
- Пол: Муж
Ещё одна загвоздка. На другой страничке https://potolokroom.ru/vidy/ стоят два блока с фото.
Вопросик: правильно ли я прописал код html для блока и стили css??
И второе: при уменьшении экрана браузера все начинает ломаться.
Помогите пожалуйста!
Заранее спасибо.
Вопросик: правильно ли я прописал код html для блока и стили css??
И второе: при уменьшении экрана браузера все начинает ломаться.
Помогите пожалуйста!
Заранее спасибо.
Ломается, потому что для блоков указанны фиксированные размеры:
и здесь:
если поменять размеры
Плюс для изображения надо задать 100% ширину...
В общем если смотреть весь код, то так:
Вот так всё будут работать как надо.
Код: Выделить всё
.vies{
font-family: sans-serif;
width: 300px;
height: 186px;
border: 10px solid transparent;
box-shadow: 1px 1px 8px rgba(170, 170, 170, 0.49);
/* Обязательные условия*/
position: relative;
overflow: hidden;
}
Код: Выделить всё
.vies .mask{
width: 300px;
height:186px;
text-align: center;
/* Обязательные условия*/
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}
width
и height
на auto
. У .vies .mask
у width
сделать 100%. Плюс для изображения надо задать 100% ширину...
В общем если смотреть весь код, то так:
Код: Выделить всё
.vies {
font-family: sans-serif;
width: auto;
height: auto;
border: 10px solid transparent;
box-shadow: 1px 1px 8px rgba(170, 170, 170, 0.49);
/* Обязательные условия*/
position: relative;
overflow: hidden;
}
a {
display:block;
}
.mask h2 {
color: #4b4848;
font-size: 13px;
font-weight: 400;
line-height: 40px;
letter-spacing:1px;
margin-top: 10px;
padding: 0 5px;
text-transform: uppercase;
text-shadow: 1px 1px 1px #0d0a0b;
background: rgba(248, 194, 71, 0.6);
}
.vies .mask {
width: 100%;
height: auto;
text-align: center;
/* Обязательные условия*/
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}
.vies img {
transition: all ease-in .5s;
margin-bottom: 0;
width: 100%;
}
.vies:hover img {
box-shadow: 3px 3px 5px #000;
transform: scale(1.5, 1.5);
}
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!