CKEditor textarea超出了Chrome和Safari中的框 [英] CKEditor textarea extending out past box in Chrome and Safari

查看:101
本文介绍了CKEditor textarea超出了Chrome和Safari中的框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在FF,Opera,IE的CKEditor中,IE可以正常工作并且看起来不错.但是在Chrome和Safari中,它的大小调整不正确,并且超出了其内部的容器.我认为这是因为Chrome和Safari目前最符合标准.请参见下面的图像.

In FF, Opera, IE the CKEditor is working and looks great. But in Chrome and Safari it is not sizing correctly, and is extending past the container that it is inside. I assume this is because Chrome and Safari are currently the most standards compliant. See the images below.

Chrome

歌剧

我尝试删除所有CSS文件,以查看是否是由CSS引起的问题,但这也无法解决.这是我给CKEditor的电话

I tried removing all of my CSS files to see if it was my css causing the issue, but that did not fix it either. Here is my call to CKEditor

//Make all textareas use the ckeditor
$('textarea.WYSIWYG').ckeditor({
    toolbar: [
        ['Styles', 'Format'],
        ['Bold', 'Italic', 'NumberedList', 'BulletedList', 'Link']
    ],
    height: 100,
    width: "225px",
    enterMode : CKEDITOR.ENTER_BR,
    resize_enabled: false
});

有什么想法会导致这种情况吗?

Any ideas what could cause this?

更新

这是代码的非常笨拙的版本,仍然会导致错误.

Here is a VERY dumbed down version of the code still causing the error.

<!DOCTYPE HTML>
<html>
<head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <title>Title</title>
        <script type="text/javascript" src="library/javascript/global/JQuery.core.js"></script>
        <script type="text/javascript" src="resources/local_javascript/ckeditor/ckeditor.js"></script>
        <script type="text/javascript" src="resources/local_javascript/ckeditor/adapters/jquery.js"></script>
        <script type="text/javascript" src="resources/local_javascript/base.js"></script>

</head><body> 
<div id="outerWrapper"> 

    <table id="FAQTable"> 

        <tr id="editingRow">
            <td class="fixedWidth">
                <textarea class="WYSIWYG" id="FAQQuestionInput" rows="5" cols="1"></textarea>                   
            </td>
            <td class="fixedWidth">
                <textarea class="WYSIWYG" id="FAQAnswerInput" rows="5" cols="1"></textarea>
            </td>
        </tr>                    
   </table> 
</div> 

这是新图片

推荐答案

这最终对我有用...添加到config.js

This finally worked for me....added to config.js

CKEDITOR.on('instanceReady', function (evt) {
    //editor
    var editor = evt.editor;

    //webkit not redraw iframe correctly when editor's width is < 310px (300px iframe + 10px paddings)
    if (CKEDITOR.env.webkit && parseInt(editor.config.width) < 310) {
        var iframe = document.getElementById('cke_contents_' + editor.name).firstChild;
        iframe.style.display = 'none';
        iframe.style.display = 'block';
    }
});

这篇关于CKEditor textarea超出了Chrome和Safari中的框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆