Opera Not Displaying Fonts Correctly
I've built my brother a small website for his online investment/financial magazine and promotional business. It shows up well in Netscape, Mozilla, and IE but for some reason I can't get Opera to display the fonts well.
My suspicions are that Opera is NOT loading the style sheet at all since some of the graphics (Top Logo Area) are also not displaying well either. I've checked the "preferences" area of Opera for style sheets and it is set to "Authors Style".
Any suggestions? The website addy is http://www.secularbull.com
Thanks in advance for any suggestions.
Megan posted this at 17:39 — 29th July 2005.
She has: 11,421 posts
Joined: Jun 1999
Looks like it's displaying some of the styles but not all because the navbar looks fine. Looking at your stylesheet, there is an error in the homepagetext definition (double ; after line-height). I dont' know if that has anything to do with it or not. Try validating the stylesheet.
Also, it's generally better to set style rules for block level elements as much as possible and not relying on classes so much. All of your styles here are classes and nothing is defined for any block level elements. A better way of designing a stylesheet is to start with the major block level elements (body, p, h1 etc.) and go down from there.
Megan
Connect with us on Facebook!
Megan posted this at 17:42 — 29th July 2005.
She has: 11,421 posts
Joined: Jun 1999
I ran your CSS through a validator and got a bunch of errors:
http://jigsaw.w3.org/css-validator/validator?text=.hori-nav+td%7Bbackground-color%3A%239E94A6%3Bborder%3A+1px+%23000000+solid%3B++width%3A+86px%3Btext-align%3Acenter+%21important%3B%7D%0D%0A%0D%0A.body+++%7Bbackground-color%3A%23B87A2E%7D%0D%0A%0D%0A.loc-border+%7Bfont%3A+.6em+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bmargin-top%3A.03in%3B%0D%0A+++++++++++++margin-right%3A.02in%3Bborder-bottom%3A1px+solid+%23000%3Bpadding-bottom%3A4px%3Bwidth%3A602px%3Bmargin-left%3A.03in%3B%7D%0D%0A%0D%0A.printloc-border+%7Bfont%3A+.6em+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bmargin-top%3A.03in%3B%0D%0A++++++++++++++++++margin-right%3A.02in%3Bborder-bottom%3A1px+solid+%23000%3Bpadding-bottom%3A4px%3Bwidth%3A588px%3B%0D%0A++++++++++++++++++margin-left%3A.03in%3B%7D%0D%0A%0D%0A.location+%7Bfont-weight%3Abold%3Btext-decoration%3Aunderline%3Btext-align%3Aleft%3Bcolor%3A%23000%3B%7D%0D%0A%0D%0A.dotborder+%7Bborder-top%3A1px+dotted+%23999999%3Bpadding-top%3A1px%3Bborder-bottom%3A1px+dotted+%23999999%3B%0D%0A+++++++++++padding-bottom%3A6px%3Bmargin-right%3A.22in%3Bmargin-left%3A.1in%3Bmargin-bottom%3A.2in%3B%7D%0D%0A%0D%0A.small+%7Bfont%3A+.6em+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bmargin-top%3A.03in%3Bmargin-right%3A.02in%3B%0D%0A+++++++padding-bottom%3A2px%3Bborder-bottom%3A1px+solid+%23000%3B%7D%0D%0A%0D%0A.pagetext++%7Bfont%3A+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A+++++++++++text-align%3A+justify%3Bcolor%3A%23000%3Bmargin-right%3A.14in%3Bmargin-left%3A.05in%3B%7D%0D%0A%0D%0A.homepagetext++%7Bfont%3A+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%3Bcolor%3A%23000%3B%0D%0A+++++++++++++++margin-right%3A.03in%3B%7D%0D%0A%0D%0A.tablepagetext++%7Bfont%3A+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23000%3B%7D%0D%0A%0D%0A.quotetext++%7Bfont%3A+bold+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Btext-align%3Ajustify%3B%0D%0A++++++++++++color%3A%23930%3B%7D%0D%0A%0D%0A.textbold++%7Bfont%3A+bold+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A+++++++++++text-align%3A+justify%3Bcolor%3A%23000%3B%7D%0D%0A%0D%0A.MsoNormalB++%7Bfont%3A+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A+++++++++++text-align%3A+justify%3Bcolor%3A%23000%3Bmargin-right%3A.14in%3Bmargin-left%3A.05in%3B%7D%0D%0A%0D%0A.MsoNormal++%7Bfont%3A+.7em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A+++++++++++text-align%3A+justify%3Bcolor%3A%23000%3Bmargin-right%3A.14in%3Bmargin-left%3A.05in%3B%7D%0D%0A%0D%0A.MsoTitle++%7Bfont%3A+bold+.9em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A+++++++++++text-align%3A+justify%3Bcolor%3A%23000%3Bmargin-right%3A.22in%3Btext-decoration%3Aunderline%3B%7D%0D%0A%0D%0A%0D%0A.smtabletext++%7Bfont%3A+bold+.6em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23000%3Btext-align%3Acenter%3B%7D%0D%0A%0D%0A.navytextbold++%7Bfont%3A+bold+.8em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A+++++++++++text-align%3A+justify%3Bcolor%3Anavy%3Bmargin-right%3A.22in%3Btext-decoration%3Aunderline%3B%7D%0D%0A%0D%0A.pagetextbold+%7Bfont%3A+bold+.8em%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bline-height%3A+15px%3B%0D%0A++++++++++++++text-align%3Ajustify%3Bcolor%3A%23f0eccb%3Bmargin-right%3A.22in%3Bmargin-left%3A.05in%3Bmargin-top%3A.1in%3B%0D%0A++++++++++++++text-decoration%3Aunderline%3B%7D%0D%0A%0D%0A.boxpagetext+%7Bfont-family%3A+Times%3Bfont-size%3A.8em%3Bmargin-top%3A.05in%3Bcolor%3Anavy%3Bmargin-left%3A.2in%3B%0D%0A+++++++++++++margin-right%3A.07in%3B%7D%0D%0A%0D%0A.smalltext+%7Bfont%3A+.6em+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bmargin-left%3A.25%3B%7D%0D%0A%0D%0A.copy++++++%7Bfont%3A+.6em+Arial%2C+Helvetica%2C+sans-serif%3Btext-align%3Acenter%3Bcolor%3A%23F0ECCB%3B%0D%0A+++++++++++letter-spacing%3A.02em%3B%7D%0D%0A%0D%0Aa.navlinks+%7Bfont%3A+.7em++Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Btext-decoration%3Anone+%21important%3B%7D%0D%0A%0D%0A.navlinks+%7Bfont%3A+.7em++Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Btext-decoration%3Anone+%21important%3B%7D%0D%0A%0D%0A.head++++++%7Bfont%3A+bold+.7em++Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23060%3B+%0D%0A+++++++++++margin-left%3A.07in%3B%7D%0D%0A%0D%0A.printhead++%7Bfont%3A+bold+.7em++Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23060%3B+%0D%0A+++++++++++++margin-left%3A.04in%3B%7D%0D%0A%0D%0A.table-bdr+%7Bbackground%3A%23ebebeb%3Bbackground-image%3Anone%3Bborder-top%3A+solid+1px+%23000%3Bborder-right%3A+solid+1px+%23000%3B%0D%0A+++++++++++border-left%3A+solid+1px+%23000%3Bborder-bottom%3A+solid+1px+%23000%3B%7D%0D%0A%0D%0A.form++++++%7Bborder-top%3Asolid+1px+%236699cc%3Bborder-right%3Asolid+1px+%236699cc%3Bborder-bottom%3Asolid+1px+%236699cc%3B%0D%0A+++++++++++border-left%3Asolid+1px+%236699cc%3B%7D%0D%0A%0D%0A.formtext++%7Bfont%3A+11px%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3Anavy%3Bmargin-left%3A.05in%3B%0D%0A+++++++++++font-size%3A13px%3Bfont-weight%3Abold%3Btext-align%3Aleft%3B%7D%0D%0A%0D%0A.radiotext+%7Bfont%3A+9px%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3B+color%3A%23000%3Btext-align%3Acenter%3Bcolor%3Anavy%3B%7D%0D%0A%0D%0A.boldhead++%7Bfont%3A+bold+14px%2C+Verdana%2C+Arial%2C+Helvetica%2C+sans-serif%3B%7D%0D%0A%0D%0A.h3++++++++%7Bfont%3A+bold+15px+Veranda%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23060%3Bmargin-right%3A.22in%3Btext-align%3Acenter%3B%0D%0A+++++++++++background-color%3A%23FBF0D9%3Bmargin-top%3A.4in%3Bmargin-bottom%3A0in%3B%7D%0D%0A%0D%0A.h2++++++++%7Bfont%3A+600+11px%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23F0ECCB%3Bmargin-top%3A.05in%3Bmargin-bottom%3A0in%3Bmargin-left%3A.04in%3B%7D%0D%0A%0D%0A.navbarhead+%7Bfont%3A+bold+.75em++Veranda%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23060%3B%7D%0D%0A%0D%0Ainput%3Afocus+%7Bbackground-color%3Ared%3B%7D%0D%0A%0D%0Aa%3Ahover++++%7Bcolor%3A%23F0ECCB+%21important%3Btext-decoration%3Anone%3B%7D%0D%0Aa%3Aactive+++%7Bcolor%3A%23000%3Btext-decoration%3Aunderline%3B%7D%0D%0Aa%3Alink+++++%7Bcolor%3A%23000%3B%7D%0D%0Aa%3Avisited++%7Bcolor%3A%23000%3B%7D%0D%0A%0D%0A.link1++a%3Ahover+++%7Bfont%3A+11px+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23F0ECCB+%21important%3Btext-decoration%3Anone+%21important%3B%7D%0D%0A.link1++a%3Avisited+%7Bfont%3A+11px+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23000%3Btext-decoration%3Anone+%21important%3B%7D%0D%0A.link1++a%3Aactive++%7Bfont%3A+11px+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23000%3Btext-decoration%3Anone+%21important%3B%7D%0D%0A.link1++a%3Alink++++%7Bfont%3A+11px+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23000%3Btext-decoration%3Anone+%21important%3B%7D%0D%0A%0D%0A.pagelink++a%3Ahover+++%7Bfont%3A+12px+Veranda%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23000+%21important%3Bmargin-left%3A.05in%3B%7D%0D%0A.pagelink++a%3Avisited+%7Bfont%3A+12px+Veranda%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23EFEBCB%3Bmargin-left%3A.05in%3B%7D%0D%0A.pagelink++a%3Aactive++%7Bfont%3A+12px+Veranda%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23EFEBCB%3Bmargin-left%3A.05in%3B%7D%0D%0A.pagelink++a%3Alink++++%7Bfont%3A+12px+Veranda%2C+Arial%2C+Helvetica%2C+sans-serif%3Bcolor%3A%23EFEBCB%3Bmargin-left%3A.05in%3B%7D&usermedium=all
Megan
Connect with us on Facebook!
NewTechGuy posted this at 20:08 — 29th July 2005.
He has: 57 posts
Joined: Dec 2004
Thanks for looking. I also ran my style sheet through a validator and got a lot of the same errors messages that I do not understand. Maybe you could tell me what the following means and how to resolve it.
Invalid number : font too few values for the property
Any suggestions would be appreciated.
Thanks again
chrishirst posted this at 20:30 — 29th July 2005.
He has: 379 posts
Joined: Apr 2005
the problem will be setting alternative font-family types in the short hand font declaration.
use the font-family: definition for the typeface
NewTechGuy posted this at 16:05 — 15th August 2005.
He has: 57 posts
Joined: Dec 2004
Thought I'd update this..... I've been validating the code for my website (both html and css) and have cleaned up the pages. Not quite finished yet as I had company from out of town for quite a while. I still have resolved my issue with Opera but I'm sure as time goes on I will.
As always, I really appreciate the assisance offered from this site.
Hats off to all of you......thanks again,
NewTechGuy
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.