I have the following line in my code in an attempt to load styling into an iFrame:
<iframe style='color:blue;margin-left:30px;@import('../../custom/courses/css/stylesheets/course.css'); />
There are two problems:
- Is it possible to import code using the @import as I am attempting to do above
- The html code in my browser outputs the following:
<iframe style="color:blue;margin-left:30px;@import(" ..="" custom="" courses="" css="" stylesheets="" course.css');</iframe>
So, my css url path is very messed up.
UPDATE
My code:
(function($){
var cssLink = document.createElement("link")
cssLink.href = "../../custom/courses/css/stylesheets/course.css";
cssLink.rel = "stylesheet";
cssLink.type = "text/css";
// frames['iframe'].document.body.appendChild(cssLink);
jQuery('iframe.field-iframe-instance').css('border', '1px solid red');//.find('body').appendChild(cssLink);
})(jQuery);
The code on the iframe fails to take effect