The style of an external CSS does not apply in my HTML embedded in Blogger using an iframe

The problem is not in the iframe , but in the what are you loading.

When trying to load it in my browser, it is giving me this error message (looking at the console, F12):

  

Mixed Content: The page at ' link ' was loaded over HTTPS, but requested an insecure stylesheet '< a href="http://www.googledrive.com/host/0Bz6Br9MUV3OCdlJVS2RlR0gzMWc"> link . This request has been blocked; the content must be served over HTTPS.

What this error means is that the browser does not want to load the CSS because it is loaded with a less secure protocol. You must bear in mind that it does not matter if you load it with link , because it is automatically redirected by google drive to use link .

Solution:

You should modify the html to use the relative protocol notation, instead of using:

<link rel="stylesheet" type="text/css"
      href="http://www.googledrive.com/host/0Bz6Br9MUV3OCdlJVS2RlR0gzMWc" />

Use:

<link rel="stylesheet" type="text/css"
      href="//www.googledrive.com/host/0Bz6Br9MUV3OCdlJVS2RlR0gzMWc" />

As you can see, what you have to eliminate is http: and let the URL start from the two bars // .

This will make that regardless of the protocol with which you load the page, the CSS will be loaded using the same protocol.

Example

Here I leave the example running, this file I uploaded to my own Google Drive and made the modification I told you above.

<iframe width="100%" height="400" src="http://www.googledrive.com/host/0B7yVPJJfN8f0VWZNbFdnc2lHSnM"></iframe>