I have a page with an iframe which gets rendered within my main page as below;
<iframe id="externalContainer">
<html>
<head>
<title>My Page</title>
<style>
.reqd {
color: blue;
}
</style>
</head>
<body>
<form id="myForm" name="myForm" method="post" action="/validate">
<span class="reqd"> *</span>
</form>
</body>
</html>
</iframe>
So, as you can see, the iframe page has <style>
defined setting the color of .reqd to blue.
Now, I want to override the color of the 'reqd' element to #F00000
How can I override the color? I already tried doing below in my main/container page styles, but it does not work i.e. does not override.
#myForm .reqd {
color:#F00000;
}
But the above does not work,