SharePoint 2007 RichHtmlField has inline style that is causing issues in ie8 - internet-explorer-8

I am working on an intranet project that is having the majority of its users move up to ie8 soon. A bug was detected where when attempting to create/edit a page, the rich html editor boxes would be squeezed compared to what they look like in any other browser.
I found the offending style, its inline and its:
style="display:inline-block"
Now if it was just "inline" then it would be fine. However, it is not.
I have attempted to override the PrefixStyleSheet attribute in the master page and have a custom style in the main css file, but it is not working at all.
I have heard that a control adapter might be helpful to post process the html but i am unsure on how to use one.
Is there any advice you guys can give me?

From my experience, using JQuery "hacks" in the master page header is the most convenient approach, without messing up the system css or the backend.
Find the element you want to override the style to a custom style, and assign your custom style. Be careful if the override is page layout specific, then might add to the page layout header placeholder instead.
http://api.jquery.com/css/
Hope it helps.

Related

Font-awesome codes overrided by toggle editor

I am editing an article and adding FontAwesome in it using Toggle Editor. I've found out that when I add the code using programmer view, it works fine. However, when I change to the designer view from the programmer view, the editor automatically edit the code like this:
Before:
After clicking "Toggle Editor":
It is quite inconvenient for me because I use the designer view to style the article frequently. Is there any solution for it?
You'll have to look into the allowed tags for the editor you're using.
In your case using JCK Editor - you can see this article on why it removes certain code
At first glance it appears there are whitelist & blacklists for some HTML. You'll probably be able to add your selectors to the whitelist and they will no longer get stripped.

No spaces in Joomla 2.5 Output

I'm in a pickle. I've designed a Joomla 2.5 site, which I have locally installed. I typically equip my installations with JCE editor for my clients, but at design time, operate in HTML mode. When all the content was in, I decided to test WYSIWYG mode to make sure nothing went awry. Unfortunately, something did. Observe the lack of spaces:
Very interesting that the problem occurs ONLY when saving from WYSIWYG view.
At first I thought JCE was malfunctioning (although the editor itself continued to show spaces), so I tried reinstalling. Then I tried other editors -- CKEditor and TinyMCE. The same symptoms manifested with them as well.
Trying to isolate the problem, I checked the database after pasting in clean markup in HTML view, and again after saving in WYSIWYG view. This is the result:
So, based on the database field, it would appear that the process of saving, in either HTML or WYSIWYG view is working properly... But then why is the output being fed to the browser different depending on which method was used to edit?
So far I've checked entity encoding, CSS (although it's obviously not a CSS issue), and tried installing on another local server. No changes in behavior.
I could really use some suggestions.
Thank you in advance for your help.
Z
PS: This is the latest version of Joomla (2.5.6), running on Apache.
When we typed some text continually this issue was occurred. Actually this was not the issue this problem was solved by using correct css style for that division.
<style type="text/css">#divid {width:750px;word-wrap;break-word;"}</style>
You have to use this css style for your division . Surely this ll resolve that problem...

using a custom javascript code in joomla

I've been asked to write a custom javascript to create a tooltip. I've done this and the code works on my localhost and on my own online webhost but it refuses to work in joomla 2.5. I've heard this could be caused by the moo tools pluggin that comes with joomla itself? what plug in should I install to make my javascript work? I checked the code and it works all around. I apologize if this is an inappropriate question.
edit: The problem is it just won't run the code at all. it doesn't apply the CSS. which is loaded from another file, though it does apply the style for the rest of the site. When there's suppose to be a custom css for the title attribute in a img tag I just get a regular text window

Webpage hosted HTML editor that graphically shows tag nesting in WYSIWYG view

I once found a webpage hosted HTML editor that optionally included the tags, as highlighted colour coded elements with the tag type, in the (almost) WYSIWYG view, but now cannot find the project anywhere.
I thought it an excellent compromise between WYSIWYG ease of use an markup flexibility.
Does anyone know which editor this was? Or maybe there is more then one editor with this feature?
Here is one that looks promising.
http://koivi.com/WYSIWYG-Editor/
This appears to match your request.
I found one such, and only one. Unfortunately it isn't the one I had seen before and so I'm still looking. They are called What You See Is What You Mean editors - WYSIWYM.
WYMeditor
Also see - http://en.wikipedia.org/wiki/WYSIWYM

CKEditor plugin rendering different in WYSIWYG and source mode

I'm starting to develop a plugin for CKEditor that needs to be used to insert some HTML snippets in a web page. This is done. Nonetheless I also need to include some special items when switching to WYSIWYG mode (e.g. something more or less similar to Show Blocks plugin, but not just using styles since I need some elements included in there). So my question is :
How could I include extra items or styles (e.g. to hide parts of the contents in WYSIWYG mode) in WYSIWYG view without altering HTML output ?
If someone could provide some information about a working (maybe simple) example, I'd also appreciate your help.
PS: If you need to know further details please ask, but for instance assume inserted raw HTML code is
<div class="xxx">Hello world !</div>
... but in WYSIWYG mode need to display a link on top of it that pops up an alert and toggles dotted border.
About injecting CSS classes in WYSIWYG mode, use addCss function.
About creating fake elements in WYSIWYG mode ... I think I can solve the problem using context menu instead.

Resources