Forum Moderators: not2easy
p { font-family: "Trebuchet MS", Geneva, Helvetica, Arial, Verdana, monospace, sans-serif; font-size: 13px; }
Well, the fonts display just fine in IE, Firefox, Netscape, but does not display properly in Opera (7). The text looks VERY large and blocky (bold?), almost like courier (monospace).
I am at my wits end, does anyone know if Opera displays "Trebuchet MS" properly or does everyone have the same problem?
If it doesn't display properly in Opera, what would a work around be?
Really appreciate your help.
from [opera.com...]
If Opera is to display the page the way the developer meant it to be displayed,
you'll need to have the following setup of Tools > Preferences > Advanced > Content,
under "Configure modes...":Author mode
[v] Page style sheet
[v] Page fonts and colors
[ ] My style sheet
[ ] My fonts and colors
[v] My link styleUser mode
[ ] Page style sheet
[ ] Page fonts and colors
[v] My style sheet
[v] My fonts and colors
[v] My link styleAlso make sure "Author mode" is selected as the default mode.
First thing I suggest is to valdiate the HTML and CSS - sometimes a small typo can be hard to notice, and one browser will have an error recovery routine that handles it but another won't. It might be something as simple as a typo in the HTML somewhere that leaves a tag open.
W3C Validator - HTML [validator.w3.org]
W3C Validator - CSS [jigsaw.w3.org]
If all checks out with the validators, then start playing with the CSS to discover what font is actually displaying, You are suspecting a monospace font (that's pretty distinctine - you may well be correct) so find out if that's what it is. After all, you do have monospace in that font list.
Change the font-family to be ONLY monospace and see if the page changes. Change your Opera default font and see if the page display changes. And so on, zeroing in precisely on why Opera is doing what you see.
mine was set at 11px and I saw what you're describing because you've chosen 10px**. When I changed my default setting to 9px everything sorted itself except the "monospace" font. My default for monospace is "courier" and when I changed the default to "Courier New" it too worked (displayed smaller).
So it is a preference setting and I can only guess that "courier" will not display smaller than 10/11px in Opera in general..
Suzy
added:**
test code from links:
.style1 {font-family: "Trebuchet MS"; font-size: 13px;}
.style2 {font-family: courier; font-size: 13px;}
.style3 {font-family: "Trebuchet MS"; font-size: 10px;}
.style4 {font-family: monospace; font-size: 10px;}
.style6 {font-family: Arial; font-size: 13px; }
.style8 {font-family: Arial; font-size: 10px; }
.style9 {font-family: "Trebuchet MS"; font-size: 1.0em; }
.style10 {font-family: "Trebuchet MS"; font-size: 0.8em; }HTML:
<p class="style1">This is the lovely Trebuchet MS font @ (at) size 13px. Too large and bold.</p>
<p><span class="style3">This is the lovely Trebuchet MS font @ (at) size 10px. Same as Trebuchet MS size 13px.</span></p>
<p><span class="style2">This is the lovely monospace font @ size 13px. No difference than Trebuchet MS size 13px.</span></p>
<p><span class="style4">This is the lovely monospace font @ size 10px. Same as monospace size 13px.</span></p>
<p><span class="style6">This is the lovely arial font @ size 13px. Appears to work fine.</span></p>
<p><span class="style8">This is the lovely arial font @ size 10px. Appears to work fine.</span></p>
<hr>
<p class="style9">This is the lovely Trebuchet MS font @ (at) size 1.0em.</p>
<p class="style10">This is the lovely Trebuchet MS font @ (at) size 0.8em.</p>
<script type="text/javascript">
function isopera(){
var op=(navigator.userAgent.toLowerCase().indexOf('opera')==-1? false :true);
document.write((op==true)?"<link href='opera.css' rel='stylesheet' type='text/css' />":"<link href='others.css' rel='stylesheet' type='text/css' />");
}
window.onload= isopera();
</script>
