[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

Font looks rough/jagged in Internet Explorer

Posted on 2009-07-01
9
Medium Priority
?
1,369 Views
Last Modified: 2012-05-07
Please take a look at the header section of this page: www.mwebdev.com/at.html. Look at the large text in the middle. Wait for the text to change (it's a slideshow). When the text changes, the font becomes very ugly and jagged in IE 6 and 7. It looks fine in FireFox.

Is this a CSS problem? I've bumped my head for hours trying to figure this out. Please help!

Thanks in advance.
0
Comment
Question by:isaacr25
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 4
9 Comments
 
LVL 8

Accepted Solution

by:
lharrispv earned 1600 total points
ID: 24754060
try giving the font a background color.  If needed you can also set the opacity so it does not show up.  For some reason IE does not play nice with fade effects and transparent background.
0
 
LVL 30

Assisted Solution

by:Britt Thompson
Britt Thompson earned 400 total points
ID: 24754123
Internet Explorer renders fonts differently from Firefox... the text always appears more jagged but it may be extra jagged if you have this setting disabled in Internet Explorer

In IE >> Tools >> Internet Options >> Advanced tab >> find the "Multimedia" section >> check "Always use ClearType for HTML"
0
 

Author Comment

by:isaacr25
ID: 24754182
lharrispv,
If I add the following code, then my entire paragraph disappears. How do I make only the background color tranparent (and not the text)?
background-color: #cccccc;
filter: alpha(opacity=0);

Open in new window

0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 8

Assisted Solution

by:lharrispv
lharrispv earned 1600 total points
ID: 24754276
give the opacity a higher number like 80 or 90 and give it a go again.... or check this post out

http://jszen.blogspot.com/2005/04/ie-bold-text-opacity-problem.html
0
 

Author Comment

by:isaacr25
ID: 24754322
I need the background color to not show at all. This really messes up the design.
0
 
LVL 8

Assisted Solution

by:lharrispv
lharrispv earned 1600 total points
ID: 24754485
what if you make a gif, png or jpg that matches the bg you have on there and set that as the bg to the div?
0
 

Author Comment

by:isaacr25
ID: 24754563
The size of the div is dynamic. It changes as the slideshow changes content. I assume this would mess things up with a background image, correct?
0
 
LVL 8

Assisted Solution

by:lharrispv
lharrispv earned 1600 total points
ID: 24754703
no make the image small like you would for the bg of say a body tag.. maybe 5 or px wide by however high the div is (that appears to be static).  Then set the background-repeat: repeat-x; (I think that is the horizantal one.. not enough coffee yet this AM)...
reember the width of the image would have to be as small as possible but wide enough that it could accomplish your pattern
0
 

Author Comment

by:isaacr25
ID: 24755491
If I use this background image approach, I would like to image to blend in to the existing background. So could I take a slice of the current header background and match it that way?
0

Featured Post

Enroll in October's Free Course of the Month

Do you work with and analyze data? Enroll in October's Course of the Month for 7+ hours of SQL training, allowing you to quickly and efficiently store or retrieve data. It's free for Premium Members, Team Accounts, and Qualified Experts!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
This article discusses how to implement server side field validation and display customized error messages to the client.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

656 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question