drop shadow on text in admin editor safari

[Mike]

Hey Everyone,

Just got an iMac (windows switcher) and ran the latest version of
web2py from source. However when I opened a controlled in the admin
editor all the text has a drop shadow behind it which makes it really
hard to read. Only appears to be an issue with Safari though since
FireFox looks ok.

Any ideas on how to fix this? Is it CSS or a browser setting?

Thanks!

Mike

[rochacbruno]

Running very well on my Mac with Safari Version 4.0.5 (6531.22.7)

[Jonathan Lundell]

Seems a little strange. In Safari, a right (control) click in the browser window should give you a contextual menu with an "inspect element" option. Use it to inspect a piece of text with the shadow, and look at the Styles column in the inspector to see where the shadow might be coming from.

[Yarko Tymciurak]

On Jun 17, 7:45 pm, Jonathan Lundell <jlund...@pobox.com> wrote:
> On Jun 17, 2010, at 5:21 PM, Mike wrote:
>
> > Just got an iMac (windows switcher) and ran the latest version of
> > web2py from source. However when I opened a controlled in the admin
> > editor all the text has a drop shadow behind it which makes it really
> > hard to read. Only appears to be an issue with Safari though since
> > FireFox looks ok.

Oh! I didn't believe it - it happens in Firefox-5 also; it's
_terrible_ and it's only the code-colored code in the iFrame of the
editor (i.e. toggle editor, and it's fine).

>
> > Any ideas on how to fix this? Is it CSS or a browser setting?

It looks ok in Chrome, Firefox, and Opera on my macbook...

>
> Seems a little strange. In Safari, a right (control) click in the browser window should give you a contextual menu with an "inspect element" option. Use it to inspect a piece of text with the shadow, and look at the Styles column in the inspector to see where the shadow might be coming from.

Yeah - you have to enable "Perferences >> Advanced >> Show Develop
Menu", then from that menu "Enable Extensions" to get this....


It isn't immediately evident to me what this is.

- Yarko

[Anthony]

Same problem in IE8 on Windows 7. Actually, I have a very high res
screen, so I keep IE zoomed at 150%, and the drop shadow is really bad
at that zoom level. If I take the zoom back to 100%, I don't notice
much problem, though the text is nearly too small for me to read
comfortably at that point. Actually, even if I zoom out (e.g., 75%), I
notice the drop shadow again. So, mostly a problem when not zoomed to
exactly 100%.

Can't test it on Chrome because the color-coded code doesn't work at
all for me on Chrome (I just get the basic text box -- no "Toggle
editor" option). Do I need an extension for it to work in Chrome?


On Jun 17, 10:00 pm, Yarko Tymciurak <resultsinsoftw...@gmail.com>
wrote:

[Mike]

I used the "inspect element" feature in Safari and got the
following...

<textarea id="textarea" wrap="soft"
onchange="editArea.execCommand(&quot;onchange&quot;);"
onfocus="javascript:editArea.textareaFocused=true;"
onblur="javascript:editArea.textareaFocused=false;" classname="null
hidden" class="null hidden" style="font-family: monospace; font-size:
10pt; width: 100%; height: 1365px; line-height: 15px; margin-left:
-3px; "> </textarea>

When I toggle the "margin-left: -3px;" attribute off the shadow goes
away. Also, the 'find' function in Safari will report twice as many
matches as there really are...one for the shadow and one for the
primary text.


I look though styles.css but didn't anything that looked like it is
setting the margin-left. Any thoughts on where else to look? CSS is
not my strong suite.

Thanks for your help so far...

Mike

[Jonathan Lundell]

On Jun 18, 2010, at 6:12 PM, Mike wrote:

> I used the "inspect element" feature in Safari and got the
> following...
>
> <textarea id="textarea" wrap="soft"
> onchange="editArea.execCommand(&quot;onchange&quot;);"
> onfocus="javascript:editArea.textareaFocused=true;"
> onblur="javascript:editArea.textareaFocused=false;" classname="null
> hidden" class="null hidden" style="font-family: monospace; font-size:
> 10pt; width: 100%; height: 1365px; line-height: 15px; margin-left:
> -3px; "> </textarea>
>
> When I toggle the "margin-left: -3px;" attribute off the shadow goes
> away. Also, the 'find' function in Safari will report twice as many
> matches as there really are...one for the shadow and one for the
> primary text.
>
>
> I look though styles.css but didn't anything that looked like it is
> setting the margin-left. Any thoughts on where else to look? CSS is
> not my strong suite.
>
> Thanks for your help so far...

This seems like very strange code. I also notice that selecting text in the textarea yields visually strange results.