Подскажите, как сделать футер

[Com]

Всем привет!

Подскажите, пожалуйста, как сделать резиновый футер. Пример прицепила внизу сообщения

Нужно, что бы правая часть с копирайтом не уезжала при любом разрешении монитора.

Наверняка ошибки в коде, посоветуйте как правильно прописать?

html

<div id="footer">
<div id="call">тел: +7 123 <noskype></noskype> 456 78 90</div>
<div id="mail"><a href="mailto:info@yandex.ru">e-mail:info@yandex.ru</a></div>
<div id="rights">Company name, 2012. All rights reserved</div>
</div><!--end footer-->
css
#wrap {
width: 940px;
margin-top:140px;

#footer {
width:100%;
background:#000;
height:45px;
left:0;
bottom:0;
position:absolute;
color:#fff;
font-size:12px;
}
#call {
float:left;
width:33%;
margin: 5px 0 0 35px;
background: url('../images/call.png') no-repeat;
padding:10px 0 0 35px;
height:30px;
}
#mail {
float:left;
width:33%;
margin: 13px 0 0 35px;
background: url('../images/mail.png') no-repeat;
padding:1px 0 0 35px;
height:30px;
}
#mail a {
text-decoration:none;
color:#fff;
}
#rights {
float:right;
width:18%;
text-align:left;
margin: 7px 0 0 35px;
background: url('../images/copy.png') no-repeat;
padding:7px 0 0 35px;
height:30px;
}

 

[Volter9]

Здраствуйте, вам надо убрать из #footer:

left:0;
bottom:0;
position:absolute;

Тогда он будет резиновым.

 

[tigra60]

Тогда он будет резиновым.

Ага! И сразу вылетит со своего места и перестанет быть прижатым.

Опять двойка, Евгений!

Общий принцип такой:
Делим футер на три блока, каждый по 33% шириной и float:left (все три!)
Далее в каждый блок вставляем параграф с текстом, а уже к этим параграфам применяем поля, отступы, рамки и фоновые рисунки.

Небольшой грубый примерчик.

Кстати, знак копирайта делается псевдосимволом &copy; , а не фоновым рисунком. И "All rights reserved" здесь лишнее.

И еще - не забывайте, что можно (и нужно!) ограничить сужение футера с помощью min-width. А для недобраузера - expression (гуглить самостоятельно).

 

[Volter9]

Тигра, для меня резиновый блок, это значит блок с шириной в 100%.

Ну тогда так учитель?

#footer {
width:100%;
background:#000;
height:45px;
left:0;
bottom:0;
position:fixed;
color:#fff;
font-size:12px;
}

 

[tigra60]

для меня резиновый блок, это значит блок с шириной в 100%

:blink: hmy: :wacko:
Значит, блок шириной 90% уже не будет резиновым? Вот печалька...

 

[Volter9]

[member=tigra60], блин не то сказал :wacko: Резиновый блок это тот блок который указан в %, т.е. размер меняется от разрешения экрана.
Простите за мою тупость :blush:

 

[motek]

Опять двойка, Евгений!

tigra60, блин не то сказал :wacko:

:biggrin:

Резиновый блок это тот блок который указан в %, т.е. размер меняется от разрешения экрана.

Вот отсюда начинай, это правильно...потом, как сказал Тигра, делим блок на три части и позиционируем влево, все три, и уже внутри этих блоков играемся контентом...
position:fixed; - зафиксирует родителя в определенном месте на странице и поломает весь макет...
учитывая, что у родителя дети позиционируются влево, сам он должен иметь position: relative;

 

[CamaroSS]

Квик фикс в данной ситуации - это закрыть фигурную скобку после определения стиля для #wrap (кстати где он?) и убрать явное указание ширины для #mail. А так я не понял, почему это футер в чистом поле.

 

[Volter9]

[member=motek], я прекрасно знаю что это зафиксирует, но на меня достаточно наехали, что я сбился с толку, что правильно и что не правильно, что надо ТС и что не надо ТС :wacko:

 

[Com]

Ребята, всем большое спасибо, так внимательно отнеслись к просьбе. Даже небольшой грубый примерчик дали.
выздоровею, попробую!