Question

为用户提供帮助 - 点击问号时会显示div：

javascript函数使div出现：

function showhelpby(whichdiv,e,divwidth,leftorright,message)
{
    e=(!e)?window.event:e;//IE:Moz

    document.getElementById(whichdiv).style.display = 'block';
    document.getElementById(whichdiv).style.width = divwidth + 'px';
    if (leftorright == 'left')
    {
        if (e.pageX)
        {
        document.getElementById(whichdiv).style.left = e.pageX - divwidth - 20 + 'px';
        document.getElementById(whichdiv).style.top = e.pageY + 'px';
        }
        else if(e.clientX)
        {
        document.getElementById(whichdiv).style.left = window.event.clientX - divwidth - 20 + 'px';
        document.getElementById(whichdiv).style.top = window.event.clientY + 'px';    
        }
    }
    else
    {
        if (e.pageX)
        {
        document.getElementById(whichdiv).style.left = e.pageX + 20 + 'px';
        document.getElementById(whichdiv).style.top = e.pageY + 'px';
        }
        else if(e.clientX)
        {
        document.getElementById(whichdiv).style.left = window.event.clientX + 20 + 'px';
        document.getElementById(whichdiv).style.top = window.event.clientY + 'px';
        }
    }
    document.getElementById('message').innerHTML = message;
}

出现的div的css是：

div.notes
{
font-family: Verdana;
font-size: 12px;
color: #000066;
line-height:140%;
display:none;
border-style:solid;
border-width:2px;
border-color:#000099;
position:absolute;
padding:15px;
background-color:#FFFFFF;
background-image:url(images/F3F3F3White200.jpg);
background-repeat:repeat-x;
overflow-y:auto;
overflow-x:hidden;
z-index:201;
}

div中显示的文字位于<p>标签中，未应用css样式。

我多年来一直在使用上述内容来显示弹出的“帮助”div。

现在，突然之间，在Visual Studio 2010中开发一个站点 - 用于内部网 - 使用IE 9查看（发布后）（我们必须使用IE） - 我的帮助div中的文本没有换行正常。 文字看似合理，文字只会在任何地方破解。这与长话没破坏无关。单词'the'可能最终会在一行上显示't'而在下一行上会显示'he'。

除了通常喋喋不休地谈论'血腥的Internet Explorer - 他们能不能做对吗？' - 任何人都知道我需要做些什么才能在固定宽度的div中正确地包装文本？

Answer 1

你有没有尝试添加word-break：正常？ http://www.w3schools.com/cssref/css3_pr_word-wrap.asp

Internet Explorer中的文本包装不正确

1 个答案: