This question already has answers here:
Chrome cut off Oswald-Light font
(4 answers)
Closed 9 years ago.
Here's a page showing my problem:
http://coreyyoungcorp.com/font-issue/
I have no idea why it's being cut off. It's not a line-height issue nor a font size issue, but I can't for the life of me figure out why on earth it's happening, and only with this font "Oswald".
Anyone have a clue?
Your "Light" and "Bold" fonts are the problem. Take a look at http://jsfiddle.net/FHCXf/1/
This is a known issue with Chrome on Windows for Oswald fonts and similar font families.
Changing the font-weight property to normal works sometimes, but it defeats the purpose if you have a bold or light font style.
Related
This question already has answers here:
How do I prevent my style from being overridden another style on a surrounding div?
(6 answers)
Closed 1 year ago.
why body color is not working?
and i am seeing this in devtools . the problem is marked on the picture.
i got the solution . just written this as base a{color:red}
This is no bug. The body color is overwritten by something else, as wOxxOm pointed out. You might wanna take a look at this Q&A.
Either you use the !important attribute in your CSS or give the specific part you want colored a more specific selector. The CSS styles priorities decline from specific to general.
I've been using a google font (Varela) for a few years on some times and suddenly I've noticed that for some reason that capitalized words of a size of 12px or smaller seem to now show with an inconsistent height between letters.
This is visible in the footer of this page on a site I made some years back
Just to clarify, yes I've seen other articles on StackOverflow such as this other post but this appears to be somewhat different as that post suggests it's a Chrome specific issue and this doesn't seem to be the case with my problem.
Has anyone experienced something similar ?
Can you check on another desktop in the same network and still the issue persists? Here all the capital are of the same size. If you have installed Varela font on the machine please remove it. I faced this kind of issue. When I uninstalled the font it became normal again and it only happens in Chrome. My machine Windows 10 - Chrome. Maybe Google Chrome gets the font from local machine first whatever CSS you give it rejects it. These are personal experience may be this could help you.
This question already has answers here:
CSS customized scroll bar in div
(20 answers)
Closed 7 years ago.
I tried searching online but I didn't find any good sources on this. Is there a way to style scroll bars with pure CSS so that it is compatible with a maximum number of browsers?
You can style scrollbars in Internet Explorer and Webkit only.
Note that these are not standard properties.
However, you can achieve this with JavaScript. One project that does this is jScrollPane.
Adding my 2 pence a little late, but if you really want to style them I would suggest trying http://jscrollpane.kelvinluck.com/. It's not a pure CSS solution like you are looking for but is a solution of sorts.
This question already has answers here:
Set background image for font color?
(5 answers)
Closed 9 years ago.
Can I make text textured by somehow setting an image as the text color, and having it repeat throughout the text?
Not possible with pure css. See previous post on Textured Text
I don't think that is possible, sorry.
You'd need to make an image.
Though if you could create the text with CSS masks, it will work :)
Yes, you can take a font of your choice and alter it so the outlines are cut out of solid blocks (like the 'oversteer' glyphs of this image instead of the 'unsteady' glyphs). You can embed this custom font into pages using CSS's #font-face, and then it's just a matter of applying a background in the normal way (and ensuring proper line-height, etc.).
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Photoshop Mock Up Font isn't same as in HTML
Hi,
I have spent last 2 hours looking for a way to make fonts, in my case Arial, look identical to what they look like in photoshop. I mean I can't use a different font, it must be smooth Arial. While fonts with no anti-aliasing look decent and almost identical in most of the browsers compared to what they look like in photoshop, I can't think of a solution to mimic smooth anti-aliasing (and others as well, but it is not that crucial for them).
Is there a way?
You can use something like sIFR or typeface.js.