Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Mulongo oyo etiyamaki na archive. Tuna motuna mosusu soki osengeli na lisalisi

javascript showing on page

  • 5 biyano
  • 2 eza na bankokoso oyo
  • 1 view
  • Eyano yasuka ya Timo88

Timo88
Timo88
more options

I had one our websites showing the javascript on the page. After some searching I found out that the script tag inherits "display:block" and shows it's content. IMO that's a bit weird, but other Browser show the same behavior. My question is not to avoid this as I can easily avoid it but if this should be considered a bug in Firefox?

An example can be found here: http://test.timo-design.nl/firefox/scriptshowing.htm

HTML of this test page: 

<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  <META http-equiv="Content-Script-Type" content="type">
  <title>Test Page
  </title>
  <style type="text/css">
  .Main *{display:block; background:#f80;}
  .Main h1{background:#0f0;}
  </style>
 </head>
 <body id="Body">
  <div class="Main">
   <h1>Script test</h1>
   <script>
    //This is an inline script which shows up in the page
    var x = 1
   </script>
  </div>
 </body>
</html>

Thanks, Timo

I had one our websites showing the javascript on the page. After some searching I found out that the script tag inherits "display:block" and shows it's content. IMO that's a bit weird, but other Browser show the same behavior. My question is not to avoid this as I can easily avoid it but if this should be considered a bug in Firefox? An example can be found here: http://test.timo-design.nl/firefox/scriptshowing.htm HTML of this test page: <pre><nowiki> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <META http-equiv="Content-Script-Type" content="type"> <title>Test Page </title> <style type="text/css"> .Main *{display:block; background:#f80;} .Main h1{background:#0f0;} </style> </head> <body id="Body"> <div class="Main"> <h1>Script test</h1> <script> //This is an inline script which shows up in the page var x = 1 </script> </div> </body> </html></nowiki></pre> Thanks, Timo

Ezalaki modifié na cor-el

All Replies (5)

ErickRibeiro
ErickRibeiro
more options

Put the SCRIPT tag outside of the DIV tag and it'll work.

Ezalaki modifié na ErickRibeiro

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 10 Contributor
more options

I would not call this a case of inheritance. Instead, you have expressly stated that every single element under .Main should be display:block by using the universal selector: 

.Main *{display:block; background:#f80;}

Perhaps it would be more logical if the universal selector (*) had some exceptions. For example, one seldom if ever would want to style the script and style tags. But I don't think that is envisioned by the current "Standards", such as they are, so Firefox is unlikely to deviate from universal being 100% universal.

https://developer.mozilla.org/docs/Web/CSS/Universal_selectors

Timo88
Timo88 Nkolo motuna
more options

ErickRibeiro said

Put the SCRIPT tag outside of the DIV tag and it'll work.

Thanks, I know how to avoid this, it was more a question of this behavior is correct or not.

Timo88
Timo88 Nkolo motuna
more options

jscher2000 said

I would not call this a case of inheritance. Instead, you have expressly stated that every single element under .Main should be display:block by using the universal selector: .Main *{display:block; background:#f80;} Perhaps it would be more logical if the universal selector (*) had some exceptions. For example, one seldom if ever would want to style the script and style tags. But I don't think that is envisioned by the current "Standards", such as they are, so Firefox is unlikely to deviate from universal being 100% universal. https://developer.mozilla.org/docs/Web/CSS/Universal_selectors

Agreed.

I now found in: http://www.w3.org/TR/html5/scripting-1.html

"... script ... The element does not represent content for the user."

But in: http://w3c.github.io/html-reference/script.html

I see,

Typical default display properties script { display: none; }

So it's a bit vague IMO :-)

Timo88
Timo88 Nkolo motuna
more options

Ok, there's much more you can show I wouldn't expect to work :-) I guess I'll have to live with it ;-) 

 head, title, meta, link, script{color:#000; display:block; width:100%; min-height:1em;}
 head{background:#FF8; padding:0.3em;}
 title{background:#f00;}
 meta{background:#0f0; margin-bottom:0.3em;}
 link:link{background:#08f; margin-bottom:0.3em;}
 script{background:#00f; margin-bottom:0.3em;}