Появляется пустое место при уменьнении размеров окна

Newbie · January 23, 2009

Подскажите, пожалуйста.

Есть страница, которая состоит из :

-шапки (имеет параметр float:right и width: 800px}

-блока кнопок (горизонтального под шапкой)

-содержимого (одно изображение, размером width:1000 height:500, позиционировано как и шапка

position: relative float:right)

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

На всех страницах нет проблем, кроме как с этой из-за большого изображения на ней.

При уменьшении размеров окна (меньше 1000px) появляются полосы прокрутки. И при прокручивании

назад видно, что шапка сдвинулась влево, как и задумывалось, но справа от шапки появляется пустое

место.

Как избежать появления пустого места справа от шапки?

Edited January 23, 2009 by Newbie

Searcher · January 23, 2009

Не вижу кода, так что ничего конкретного сказать не могу. Возможно достаточно будет в правильном месте указать overflow:hidden.

Newbie · January 23, 2009

Это я ошибся второпях. Прошу прощения.

шапка и содержимое позиционировано не absolute, а relative (в своём первом посте уже исправил)

/*css*/
.shapka {background-image : url(img/shap5right.gif); width:814;height : 250;
	background-repeat : no-repeat;  float:right;border:0 solid black;margin-top: -30px;}
.tabl {float:right; }
.bigimage {position:relative;float:right;   background-image : url(img2/image.jpg); height : 598; width:1000; 

background-repeat : no-repeat;margin-bottom:-20px }

/*html*/
<body>
<div class='shapka'> </div>
<table class='tabl' border='1' width='814px' height='15' >  
<TR border='1' align='center'> 
<td border='1' width='200px'> Первая ссылка</td> <td border='1' width='390px'> Вторая ссылка</td>
<td border='1' width='200px'>Третья</td> 
</TR>
</table>

<div class='clear'> </div>
<div class='bigimage'> </div>
</body>

Edited January 23, 2009 by Newbie

Newbie · January 23, 2009

Частично решил проблему,( с помощью javascript.)

добавил div класса main :

.main {min-width:1000px}

и завернул всё в него.

Всё стало работать корректно (пустота справа от шапки при уменьшении размера окна не появляется).

Но это исправило дело только для всех обозревателей кроме IE.

Тут вышел из ситуации используя експрешн так:

<style type="text/css">
.main {
    width:expression(document.documentElement.clientWidth < 1000 ? "1000px" : "auto");
}
</style>

<comment>
  <style type="text/css">
  /* Для всех других кроме IE */
   .main {min-width:1000px}
  </style>

Но как видите использован javascript.

Подскажите пожалуйста, есть ли в данном случае какая-либо альтернатива яваскрипту, уж очень не хочется лишний раз его использовать ещё и по причине того, что в броузере появляется сообщение: " Броузер в целях безопасности заблокировал activex, разрешаете ли вы выполнение..."

Edited January 23, 2009 by Newbie

Sign In

Появляется пустое место при уменьнении размеров окна

Question

Newbie

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

Searcher

Link to comment

Share on other sites

Newbie

Link to comment

Share on other sites

Newbie

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information