Вёрстка шапки сайта. Помогите новичку!

Question

Вёрстка шапки сайта. Помогите новичку!

Юра Профи (652), на голосовании 13 лет назад

Здравствуйте. Решил вот сделать сайт для фирмы, на которой работаю. Раньше такими вещами не занимался, поэтому скачал видеоуроки с торрента. Начал делать шапку сайта. Она у меня состоит из основного фона (заднего, div id="header"), логотипа справа (div id="car_logo") и логотипа слева (div id="latoriza_logo"), которые идуn поверх основного фона. Вот скриншот того, как это всё выглядит:

Вёрстка шапки сайта. Помогите новичку!

Цыфрами позначил блоки DIV.

Код файла index.html:

<body>

</body>

Код файла style.css:

#header {
height: 250px;
width:100%;
background-image:url(images/background_header.png);
background-repeat:repeat-x;
}

#latoriza_logo{
margin-right:0%;
margin-top:3px;
height:250px;
width:327px;
float:right;
}

#car_logo {
margin-left:0%;
margin-top:0px;
height:270px;
width:650px;
float:left;}

На первый взгляд всё нормально стоит и работает, но есть некоторые нюансы:

1. При изменении размера окна логотип справа "уезжает" :

Вёрстка шапки сайта. Помогите новичку!

Подскажите как зафиксировать его так, что-бы он не сьезжал при изменении размера окна?? ?

2. Вместо зеленого фона хочу подставить свою картинку. Как задать её размер? А то подключаю картинку и вот:

Вёрстка шапки сайта. Помогите новичку!

При масштабе 100%, торчит ещё кусок какой-то. . как его убрать???

Дополнен 13 лет назад

Код файла index.html:

<body>

</body>

Answer 1

а зачем делать шапку слоями.. . почему просто не сделать одной картинкой?

Answer 2

Видеоуроки css и html [ссылка заблокирована по решению администрации проекта]
Если фирме нужен сайт. То пусть обращаются ко мне:)

Answer 3

1) добавить min-width в пикселях (для шапки, а еще лучше - для всего контейнера, в котором и контент, и шапка, и футер)
2) background-size (для IE<9 - [ссылка заблокирована по решению администрации проекта] .net/html/css3/background-size/ - пробел перед .net убрать)
как второй вариант - ограничить и максимальную ширину (max-width) по размеру картинки, но в данном случае будет узковато. .
width: 100% можно вообще не писать. блочный элемент и так шириной 100% по умолчанию

Еще несколько замечаний: логотип - это ссылка на главную страницу сайта (на всех остальных страницах) и принято его ставить слева, если конечно сайт не на иврите, или арабском) ) )
два логотипа - это перебор) )
Фоновая картинка не подходит. . Либо вольво затонул, либо у вас логистика водным транспортом. То, что Латориця - это река, в данном случае неважно. . Картинка должна отражать суть деятельности.
Логотип у вас тоже крут) ) - Общество защиты лесов и парков?))

Answer 4

Сделай одолжение, закажи сайт у тех, кто этим зарабатывает деньги, иначе в интернете станет на одно УГ больше. Зачем фирме позориться? Наоборот же надо. Это не тот случай, где надо экономить, делая самому. Сайт - это лицо. Ты бы кому свое лицо доверил, соседу-сантехнику или косметологу в салоне?

Answer 5

По-моему, твои беды проистекают из-за желания сделать резиновый дизайн сайта.
Откровенно говоря, я не сторонник этого. Все свои сайты делаю в расчете на просмотр
их на экране минимальной шириной 1280 пикселов по горизонтали. Иначе на более
узком пространстве не разместить фотографии, схемы, таблицы, и др. изображения,
которые я хочу разместить.

Answer 6

делай одну картинку в фотошопе
закинуй в аштмл файл а в цсс просто выбираешь размер и т д