I have a bit of a problem with text color in chrome.
i am using a class in CSS:
.game_info{font-size:3; font-weight:bold; color:#000000;}
as you can see, i want the text color to be black. this works well for FF and IE, but in chrome i get a different color.
this is the HTML code:
<a class="game_info">
Achilles is an awsome online adventure game. Fight your enemies using spears, cutting heads of enemey and scaring them!
Very Bloody game! there are Survival mode and Normal Mode. ENJOY !</a>
you can view the page is http://www.sababagamesonline.com/Achilles.php
Yoni
change the class a.game_info{}
I'm seeing black text in FF and Chrome on the site you linked. Have you tried clearing your browser cache?
Using:
Windows XP SP 3
FF 3.6.13
Chrome 8.0.552.237
IE 7.0.5730.13
Black is applied in all browsers when inspecting the CSS applied using webtools. Hex colour finder is also showing black rendered in my browsers. Do have specific browser versions you are using? How are you determining the colours shown are different?
devmau5
Related
I'm making a website on if Cadbury's website redesign was given to me. It's going OK, but there are completely different colours displayed in Firefox than in Opera and other browsers.
My background color is : #482e91
Firefox:
Opera:
I've also noticed this in other browsers. Why is this happening and how can I fix this?
According this answer:Opera (and Chrome) is changing colors of my images! Why ? How to stop that?
Use:
background-color:rgb(72,46,145)
I convert the color here:https://www.rapidtables.com/convert/color/hex-to-rgb.html
Note: this issue is on windows.
I found that text my current website is shown different in Chrome and FF. The font is Verdana. The same word in FF look wider than in Chrome. I could not find the reason, so I start to search site that also use Verdana.
I found this site that uses Verdana for side navigation. The links look different in Chrome and FF as well. (Screenshot in chrome, in FF).
But then I found this site where text is also in Verdana. But on this site text looks the same in Chrome and FF?
Why this happens and how to make the Verdana text look the same in these two browsers.
UPD: I added the showcase in jsbin. (I thought that it was more real if I gave links to real site where you can see the problem). Open the jsbin file in Chrome and FF, run js and open console. You can see the width of the div with text in FF is 53 and in Chrome - 49.
The problem is you're scaling the font down to something very tiny, which is impossible to get right: each font engine will do pixel aligning differently, so Firefox, IE, and Chrome will all start to show different metrics the smaller you make things, because they all use different font engines.
Stick to the recommended minimum of 16px and higher and the browsers report the same dimensions; http://jsbin.com/caxasahacu/edit?html,css,js,console,output
(remember that not everyone has eagle-vision. For the vast majority of users, 16px is pretty much the smallest you can reliably make text before you're forcing people to zoom)
I have saved the image below using an embedded sRGB profile. Photoshop is set up with the proper color settings (RGB is sRGB IEc61966-2.1) and proof setup is "Internet Standard RGB (sRGB)". The image looks the same in Photoshop, Safari, and Firefox. But viewing it in Chrome 23 gives me a very dull image as if its not reading the embedded color profile.
Pages such as this suggest that Chrome is properly managing color profiles. So am I doing something wrong here? Is it possibly a bug in how Chrome is handling color profiles? I have seen Chrome do some weird stuff (color profiles being obeyed and ignored back and forth as I scroll) in previous versions.
You could try removing the colour profile, and then saving out the image again following the guidelines from this guy ยป
Unfortunately you might have to fiddle around with your image once the colour profile's been stripped out but at least then you'll have a clean slate.
Use # color code. it works better than R,G,B and...
Oi!
I have a question regarding the differences in how images are being rendered inside of Firefox then in Internet Explorer. Firefox version is 3.5.19 and Internet Explorer version is MSIE 7.0.
Firefox http://www.wmclan.net/i/images/15877834356924635314.png
Internet Explorer http://www.wmclan.net/i/images/95502460007153569229.png
I was thinking a possible solution from Firefox 3.5 color correction hack? but is there a better way of doing that instead of running every single image through that process? How do I make it so that the images have the same background color as the background... I selected the color from the background with photoshop's color picker and used the same color code for each the image and the background image. This works fine with IE and also Chrome.. have not tested on other browsers.
This has to do with the gamma data that is added to the images. I thinks this is only a mac issue. The image is altered based on the gamma data, and doesn't match the css color values.
The solution you found is the only way to disable this "feature".
If you don't like the command line there is also easy drag and drop tool called PngThing.app for mac. I'm not using windows, so you'll have to google for that.
My customer is telling me there are black outlines around the elliptical links on this page
http://animactions.ca/volet_entreprise.php
when using Internet Explorer. None of my pc's show this and i'm not sure how to fix this.
Thanks
It seems to be the outline of the coordinates area, set your CSS there as folows:
p.style2,
p.style2:focus,
p.style2:active,
p.style2:hover {outline:none; border:0;}
Should take care of it, but if not you may try:
p.style2 map,
p.style2 map:focus,
p.style2 map:active,
p.style2 map:hover {outline:none; border:0;}
Hope it helps...
Btw: I've tested that link on FF, IE 7 & 8, Safari, Chrome and Opera Over Windows, and FF over Linux and it was all ok... my guess is that you're client has an old browser's version that needs to be updated
It's probably because you're using 24-bit .png background images with alpha transparency and your client must be using IE6 (which doesn't natively support this). If this is the case then you need to implement a PNG transparency script. Here are a few:
http://www.twinhelix.com/css/iepngfix/
http://www.dillerdesign.com/experiment/DD_belatedPNG/
http://jquery.khurshid.com/ifixpng.php
Some browsers show a border around images inside <a> elements, though off my head it's a blue border rather than a black one. Try border: none instead of outline: none.
EDIT I can't reproduce it either.