henry_flower: A melancholy wolf (Default)
henry_flower ([personal profile] henry_flower) wrote2011-07-03 12:55 pm

The Absolute Position

Крохотный урок UI: как не нужно делать.

Лет 5 назад, еще до всяких всплывающих js-вых дикбаров, стало модно втискивать ВАЖНЫЕ статические сообщения в верхний правый угол (в виде картинки):

https://lh3.googleusercontent.com/-xgcW_Uvr7-0/ThA3S9or1eI/AAAAAAAAAUE/DhMpLuyxF4o/s800/absolute-position.png

В конкретном примере это сделано так:

<div id="giveback">
  <a href="blah-blah" target="_blank">
     <img src="give_back_banner.png">
  </a>
</div>

Где #giveback:

#giveback {
    position: absolute;
    right: 0px;
}

#giveback a {
    border-bottom: 0px;
}

Поцаны, я понимаю, что нужно донести и чтобы помнили, но, если кто-то заметил, из-за position: absolute, png-картинкой полностью закрывается самая правая ссылка (Sing Up), если у вас нетбучек с резолюшеном 1024x600.