Почему мое всплывающее сообщение CSS не охватывает ширину области просмотра браузера в IE?

Question

У меня есть это для моего всплывающего сообщения (как и в stackoverflow, вы знаете, что «вы заработали значок», «у вас есть новые ответы» вверху):

#message {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 105;
    background-color:blue;
    font-family:Arial,Helvetica,sans-serif;
    font-size:100%;
    text-align:center;
    font-weight:bold;
  height: 26px;
  width: 100%;
}

Сейчас я не очень хорошо разбираюсь с CSS, но мне бы хотелось исправить IE. В Firefox окно сообщения охватывает область просмотра слева направо:

+------------------------------------+
|<---------------------------------->|
|                                    |

... но в IE он достигает левого края области просмотра, но затем останавливается примерно за 2 см до правого края:

+------------------------------------+
|<---------------------------------> |
|                                    |

Есть идеи, почему?

Answer 1

попробуйте установить вправо: 0, а слева: 0. Вы можете одновременно установить влево и вправо при позиционировании абсолютного.

Answer 2

Если тело (или другой соответствующий контейнер) может scroll & mdash; то есть, если у него нет стиля overflow: hidden & mdash; тогда IE (часто, по крайней мере) предварительно зарезервирует место с правой стороны для полосы прокрутки. Попробуйте установить overflow: hidden в своем теге body, просто чтобы посмотреть, что произойдет - это может не быть тем, что вам нужно сделать в целом, чтобы устранить проблему.