skip to Main Content

I try to add the code behind to my css as solution for the change of text on a Iphone when the devices rotates.

Strange thing is that the code will not applied to the tag. When I look with the inspector of Firefox the properties will be empty. When I add the code to the tag <body> in the css file, everything works fine.

css file:

html{
 -webkit-text-size-adjust: 100%;
}

html file:

<!DOCTYPE html>
<html>
 <head>
 <base href="/" />

 <title>Website title</title>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <link href="layout/styles/main.css" rel="stylesheet" type="text/css" media="all">
 <link href="layout/styles/mediaqueries5.css" rel="stylesheet" type="text/css" media="all">
 <link href="layout/styles/hamburgers.min.css" rel="stylesheet" type="text/css" media="all">    
</head>

I load the css between the <head></head> tags.

Does anybody knows why I can’t add the properties to the <html> tag. Is the problem that the css file not loaded is until the head?

2

Answers


  1. Chosen as BEST ANSWER

    I found it. There was a wrong code on the first line of the css file, that's why the first line didn't load properly. Now it does. Thanks for thinking with me.


  2. You are using a -webkit-prefixed CSS extension and Firefox is not webkit based.
    There are also -moz based CSS prefix for Firefox. However, there’s no such a thing as -moz-text-size-adjust and Firefox doesn’t support it.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search