[
https://issues.apache.org/jira/browse/JSPWIKI-703?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13108040#comment-13108040
]
brushed commented on JSPWIKI-703:
---------------------------------
The problem is related to a rendering bug in IE9 when treating a :hover inside
a floated element, with the overflow selector set to 'auto'.
We use overflow in JSPWiki to automatically generate horizontal scrollbars when
the page content is to wide to fit the screen; vertical overflow is always
shown by extending the page downwards.
Apparently, IE9 has a unexpected side-effect on :hover.
This is eg used on all the headers to display the section edit link or the hash
link.
In such a case, IE9 changes the page width or height, every time you hover over
such a link. ( you can see how the size of the scrollbars change) I couldn't
find on google any reference to this IE9 bug.
It is easy to reproduce with this html snippet. Simply hover your mouse over
the :hover elements, and see the size of the floated div grow downwards !
{noformat}
<style type="text/css">
.view { margin:2em; width:50%; float:right; overflow:auto; border:2px solid
lime; }
.hover:hover { background:yellow; }
</style>
<div class="view">
<p class="hover"><b>Hover me plse</b></p>
<p>some long text here to overflow the page width
abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz</p>
<img src="IE9_wideimg.bmp" alt="test" />
<p>some long text here to <span class="hover">o-v-e-r-f-l-o-w</span> the page
width
abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz</p>
</div>
{noformat}
After some experimenting, I found that adding an inline container (eg a span
element) to wrap all contents of the floated element, will stops IE9 to change
the page width or height.
Here is the updated html snippet:
{noformat}
<div class="view">
<span><!-- fake inline element, to workaround a IE9 render bug
float+overflow/auto --!>
<p class="hover"><b>Hover me plse</b></p>
<p>some long text here to overflow the page width
abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz</p>
<img src="IE9_wideimg.bmp" alt="test" />
<p>some long text here to <span class="hover">o-v-e-r-f-l-o-w</span> the page
width
abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz0123456789abcdefghijklmnopqrstuvwxyz</p>
</span>
</div>
{noformat}
For JSPWiki, we need to add a <span> element inside the <div
class="pagecontent"> element. (and possible also on some other places)
dirk
> contents oversize page auto lessen (目录过大造成页面自动缩小)
> -------------------------------------------------
>
> Key: JSPWIKI-703
> URL: https://issues.apache.org/jira/browse/JSPWIKI-703
> Project: JSPWiki
> Issue Type: Bug
> Components: Default template
> Affects Versions: 2.8.5, 3.0
> Environment: apache-tomcat-6.0.32;
> jdk1.6.0_26;
> browser:ie 9.0.8112.16421;
> JSPWiki v2.8.4;
> OS win7
> Reporter: 卢海宁
> Assignee: brushed
> Priority: Minor
>
> My English is not my forte, i'm sorry give you the inconvenience of reading.
> bug问题主要的表现为建立过大目录后,在目录和正文之间做鼠标焦点的切换会使页面的宽度不断的减小。
> 但是,当页面的宽度减到最小之后,页面又会恢复正常。然后又可以继续减小,周而复始。
> 为了直观的体现Bug的现象,我已经将我的页面建立在http://www.jspwiki.org/上了。
> 具体的地址是:http://www.jspwiki.org/wiki/%E9%9B%BE%E5%86%89
> I am sorry for the inconveniences I caused you due to my English inadequacy.
> The bug's main effects is when the table of contents is too large, switching
> the mouse cursor between the table of contents and the main content will
> cause the page width to constantly decrease. However, when the page width has
> decreased to its minimum, the view will return to normal. It will then
> decrease again, and continue the cycle.
> To show the bug, I have put my page on http://www.jspwiki.org. The specific
> web address is http://www.jspwiki.org/wiki/%E9%9B%BE%E5%86%89.
> I discovered a problem. The bug will only show in the IE9 browser, and it's
> only when compatibility view mode is not enabled!
> Thank you for w34p0nx's help me to translate this description!
--
This message is automatically generated by JIRA.
For more information on JIRA, see: http://www.atlassian.com/software/jira