Широкий стол с горизонтальной полосой прокрутки

Question

У меня есть таблица внутри пары вложенных элементов div. В одном столбце содержится изображение, ширина которого делает общую ширину страницы шире, чем дисплей, и отображается горизонтальная полоса прокрутки.

Эта ячейка взята из всплывающего окна asp.net ajax (при наведении мыши) и скрыта с помощью javascript, поэтому полоса прокрутки не нужна.

Есть ли способ через css / xhtml сделать так, чтобы полоса прокрутки не показывалась? Я уверен, что проблема заключается в ширине ячейки таблицы, поскольку при ее удалении полоса прокрутки исчезает. Элемент изображения вложен в div. Я попробовал переполнение: скрыл и манипулировал шириной ячеек таблицы - ни один не работал, по крайней мере без изменения ширины изображений.

Заранее спасибо.

Answer 1

Я должен был упомянуть тот факт, что эта проблема возникает только в IE7, а не в FF3. В любом случае, следующая ссылка иллюстрирует ошибку, с которой я столкнулся. Надеюсь, что это поможет любому, кто столкнется с этой проблемой.

http://snook.ca/archives/html_and_css/position_relative_overflow_ie/

Answer 2

Я не могу сказать, что уверен, что вы получите полосу прокрутки с переполнением: скрыто, но вот хитрость, которую я использую для всплывающих окон при наведении мыши:

HTML:

 <div><a href="#" class="showtooltip">Text you want visible at all times. <div
 id="tooltip">elements you want for mouse tooltip</div></a>

CSS для форматирования ссылок:

a:link .showtooltip{
//CSS
}
a:hover .showtooltip{
//CSS
}
a:hover .showtooltip{
//CSS
}
a:active .{
//CSS
}

Ваш CSS, вероятно, будет одинаковым для всех тех, кто будет дальше, нам нужно установить CSS для всплывающей подсказки:

a:link .showtooltip div{
visibility:hidden;
}
a:hover .showtooltip div{
visibility:hidden;
}
a:hover .showtooltip div{
visibility:visible;
//CSS to properly position and size div
}
a:active . div{
visibility:hidden;
}

Затем можно записать свой ajax в document.getElementById ('tooltip')