Some font of my pages change into Times New Roman ... without change css ... why? Options

[calmabubbasst]

Hi folks, agains i'm here looking for your help

Some sections of all my pages change fonts into Times New Roman ... without change css ... and i dont know why and how to fix it

As an example this one https://www.cfsystem.it/news/news1.html

fonts change into Times New Roman in all the yellow sections, and also the 1st image it's move on up ...

Could you help me to understand why, and also how to fix it?

[Christian J]

I don't see that in my browsers, which browser and OS are you using? The CSS specifies the font "Open Sans", do you have that installed?

BTW, this:

CODE

<span>&bull;&nbsp;Trasportatore a nastro dimensioni 500x2000 mm</span><br />
<span>&bull;&nbsp;Telaio realizzato in lamiera di acciaio zincata</span><br />
<span>&bull;&nbsp;Tappeto liscio in pvc nero</span><br />
...

really should be marked up with UL and LI elements instead.

, and also the 1st image it's move on up ...

I don't see that either. Possibbly it could be caused by the float, if so perhaps you could try using "inline-block" instead of "float".

[pandy]

I don't see any of it in FF but I do see both things happening in chromium based browsers (Edge and a probably oldish version of Iron).

Strange. Requires a closer look.

[pandy]

And Vivaldi and Brave. So why does chromium do this? There are no CSS errors (except a style sheet is missing altogether).

[pandy]

For some reason chromium doesn't like how the font name is written. This rule.

CODE

#barraBianca #content {
    width: 100%;
    max-width: 1000px;
    margin: 0px auto;
    padding: 20px 0;
    font-size: 13px;
    color: #333;

    font-family: 'Open Sans', serif;

    font-weight: 600;
    text-align: justify;
}

If I change the font-family declaration to this...

font-family: 'Open Sans', sans-serif;

...I do get a sans-serif font, so the rule is read. Chrome just doesn't like that font family. BTW the backup generic font-family should be sans-serif since your font of choice is a sans-serif font.

[pandy]

The plot thickens. I don't have a font called Open Sans. But I have one called OpenSans. Heureca! Or so I thought. Changing the font name in the CSS to OpenSans doesn't help one bit. And FF does display some sans-serif font without changing the original rule, if it is that OpenSans or another one I don't know.

[pandy]

Changing the first choice font to something totally different, for example 'Comic Sans MS' works a treat. So nothing wrong with the rule. It's the font name. What is it really called? You need to look that up yourself.

It turned out that the OpenSans I found on my machine was in a program folder, not in the font folder as I though (I just searched disc for open+sans). So why the heck do I get a sans-serif font in FF when I don't have the probably wrongly named font and the backup is serif?

[calmabubbasst]

tnx for support me guys

I dont know why strange problems looking ever for me

... you have to know that:
- when i've copy this code, all the pages runs fine till some times ago - all WITHOUT DO CHANGE ...
- I'm use to work with Chrome but also FF Opera and more but now I cant be able to view no one pages correctly with any browser

NOW, if i dont misundestood, i have to change "font-family from 'Open Sans', serif;" to "font-family: 'Open Sans', sans-serif;" ?

Why Christian ask to me if i've installed that font? Html/css dont call fonts from web? Dont use google fonts?

All the used fonts, arent called from this 3 codes?
<link rel="stylesheet" type="text/css" href="css/movy.css"/>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Oswald:400,700' rel='stylesheet' type='text/css' />
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Economica:400,400italic,700,700italic' rel='stylesheet' type='text/css'>

https://ibb.co/tmfHbXt
https://ibb.co/PTZ5rW2
https://ibb.co/n74bNrT
https://ibb.co/HDYMbTv

[Christian J]

And Vivaldi and Brave. So why does chromium do this? There are no CSS errors (except a style sheet is missing altogether).

I see both problems in Brave, but all my other browsers are OK (Vivaldi, Edge, Firefox, K-Meleon etc).

[Christian J]

BTW the backup generic font-family should sans-serif since your font of choice is a sans-serif font.

To clarify: I assume you mean above that the CSS should declare a sans-serif fallback font since "Open Sans" is serif?

The plot thickens. I don't have a font called Open Sans.

I do.

[pandy]

NOW, if i dont misundestood, i have to change "font-family from 'Open Sans', serif;" to "font-family: 'Open Sans', sans-serif;" ?

Yes, you should. But that only guarantees you get a sans-serif font and get rid of Times New Roman. It could be any sans-serif font the user has on his computer.

Why Christian ask to me if i've installed that font? Html/css dont call fonts from web? Dont use google fonts?

The font of your choice will only show up if it's installed on the user's machine. That's why that generic fall back is used, serif or sans-serif. You'll at least get the right kind of font.

[pandy]

BTW the backup generic font-family should sans-serif since your font of choice is a sans-serif font.

To clarify: I assume you mean above that the CSS should declare a sans-serif fallback font since "Open Sans" is serif? .

Uh no. I lost a word, but I think a font named "Open Sans" should be a sans-serif.

But yes, it makes no sense to back up a sans-serif font with serif or vice versa.

[pandy]

calmabubbasst, do you have a font called 'Open Sans' or OpenSans or anything else like that installed on your machine?

I think you misunderstand web fonts (like google fonts). It's when you use that the font doesn't need to be installed on the user's machine. It's downloaded on the fly. It's when you do it the normal way, without web fonts, the font needs to be already be installed on the user's machine.

If I have one singe font installed, say Courier New, and the site doesn't use web fonts all text will display in Courier New for me.

But Christian and I have varied and peculiar problems with your font too, so it's more to this than what fonts you have, but we must start somewhere.

[Christian J]

Why Christian ask to me if i've installed that font? Html/css dont call fonts from web? Dont use google fonts?

Oh sorry, I didn't even think about using webfonts. I suppose my browsers use the "Open Sans" font already installed in my copy of Windows --when I look in Brave Browser's or Firefox' Inspector (the Network sub menu) it seems several files are blocked (not just the font files). In Vivaldi there's also error messages like this:

CODE

Mixed Content: The page at 'https://www.cfsystem.it/news/news1.html' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Oswald:400,700'. This request has been blocked; the content must be served over HTTPS.

...and this explanation:

CODE

Even though the initial HTML page is loaded over a secure HTTPS connection, some resources like images, stylesheets or scripts are being accessed over an insecure HTTP connection. Usage of insecure resources is restricted to strengthen the security of your entire site.
To resolve this issue, load all resources over a secure HTTPS connection.

Indeed, in your HTML you use a HTTP URL here (maybe also in other places):

CODE

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700|Oswald:400,700' rel='stylesheet' type='text/css' />
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Economica:400,400italic,700,700italic' rel='stylesheet' type='text/css'/>

This post has been edited by Christian J: May 1 2023, 02:48 PM

[Christian J]

To clarify: I assume you mean above that the CSS should declare a sans-serif fallback font since "Open Sans" is serif? .

Uh no. I lost a word, but I think a font named "Open Sans" should be a sans-serif.

Oops, I lost a word too. I meant to say:

"I assume you mean above that the CSS should declare a sans-serif fallback font since "Open Sans" is sans-serif?"

[pandy]

That's what I said? Except I dropped the word (should) be.

[Christian J]

Yes, I just wanted to make sure I understood it correctly.

BTW I've edited my post above a number of times. I suspect the problems are related to mixing HTTPS and HTTP.

[calmabubbasst]

Yes, I just wanted to make sure I understood it correctly.

BTW I've edited my post above a number of times. I suspect the problems are related to mixing HTTPS and HTTP.

..and you got it!!!
I mean, I got it! You hit the goal

The problem was difference betwen http and https - https win (i dont understand why some mounth ago http+https ran but not now) anyway now you have fix it

Thank you very much to the two html GODS

[pandy]

Ah, that obvious! We should be ashamed we didn't think of that right away. Especially I who didn't think of it at all.

Still strange browsers handle it differently though.

Thank you very much to the two html GODS smile.gif

Well, maybe one very small demi-god. And that ain't me.

[pandy]

Now why doesn't the quoted smilie work?