Помогите сделать резиновый блок и блоки чтоб в нём не наползали друг на друга

а.. туплю
"Поменяла высоту красного блока на 150 пикселей"
у красного блока вообще не должно быть высоты.
ни у одного блока из этих. это для наглядности было.

вот убрал
Для просмотра ссылки Войди или Зарегистрируйся
 
Спасибо огромное, помогли ) Если возникнут вопросы ещё , спрошу...А пока сама буду ковырять. Вообще снизу под жёлтым и синим необходим ещё и зелёный на всю ширину красного а в нём текст, вставлять также ? Может в этот макет вставите для наглядности, я сохраню а домой приду сама уже доковыряю.
 
Ещё заметила что на синем блоке картинка растягивается, а на жёлтом нет...Это так должно быть?
 
Kristinka77 написал(а):
Ещё заметила что на синем блоке картинка растягивается, а на жёлтом нет...Это так должно быть?
Нажмите для раскрытия...
картинка в синем - огромная. гораздо больше контейнера в котором она. соответственно она под действием max-width: 100% не увеличивается черт знает как. а в рамках своего контенера. а лого - именно такого размера. если оно будет больше по ширине, соответственно больше не расширится.
опять же я не знаю какие у вас изначальные данные. надо больше и чтоб растягивалось - загрузите большую картинку.
канеш еще можно на лого повесить width: 100%, тогда картинка растянется, но я бы крайне не советовал это делать, ибо в этом случае в случае маленькой картинки она растянется и все бока с увеличением вылезут
 
vytyacom написал(а):
картинка в синем - огромная. гораздо больше контейнера в котором она. соответственно она под действием max-width: 100% не увеличивается черт знает как. а в рамках своего контенера. а лого - именно такого размера. если оно будет больше по ширине, соответственно больше не расширится.
опять же я не знаю какие у вас изначальные данные. надо больше и чтоб растягивалось - загрузите большую картинку.
канеш еще можно на лого повесить width: 100%, тогда картинка растянется, но я бы крайне не советовал это делать, ибо в этом случае в случае маленькой картинки она растянется и все бока с увеличением вылезут
Нажмите для раскрытия...

понятно. дальше я сама ))) спасибо за помощь
 
Я дома на тестовом сайте всё попробовала, вроде всё устраивает кроме одного, вот смотрите при сжатии страницы вот до этого уровня, всё хорошо

Для просмотра ссылки Войди или Зарегистрируйся

Если ещё чуток сжать то все блоки прыгают друг под друга, вот так

Для просмотра ссылки Войди или Зарегистрируйся

некрасиво как то, как отключить ТОЛЬКО эту функцию, чтоб блоки и далее продолжали стоять на месте как на первом скрине

Вот тестовый сайт Для просмотра ссылки Войди или Зарегистрируйся
 
У вас там кстати на враппер min-width: 990px;
Для просмотра ссылки Войди или Зарегистрируйся

Лучше в стили добавить

.wrapper, .wwide {
min-width: 990px;
}
@media (max-width: 1000px) {
.wrapper, .wwide {
min-width: inherit;
}
}

а по поводу чтоб стояли как было
Для просмотра ссылки Войди или Зарегистрируйся
медиа запрос этот удалите
только эт самое, оно дико сузится на минимальных разрешениях. в общем, будет еще хуже ;)
просто можно разрешение поменять
@media (max-width: 767px) {

на
@media (max-width: 480px) {
к примеру
 
так лучше ))) поставила @media (max-width: 240px) {

а вообще правильно я всё делаю? просто мне стадартная верхняя часть шаблона Gemini не устраивает, мне там нужны свои баннеры и менюшки
 
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху