Twitch Embed (Chat & Channel) Not working for Firefox browser


#1

I’m new to making websites but I’m fooling around with coding and can’t find a work around.

Check the screenshot:

On Chrome the chat and background image works fine, on Firefox they don’t work. Can anyone advise? Is this a bug?

Below is the code I’ve made so far…

<Header>
	<Title>GTurbo.Club - Home</Title>
</Header>
<Body bgcolor="333333" text="CCCCCC">
	<center>
		<P><b><h1><font color="#9966FF"> Welcome to GTurbo.Club!</font></h1></b></P>		
		<P><b><i><h5><font color="FFFF33"> This website is run off of Paypal Donations </font></h5></b></i></p>
	</center>
	<table align="center" Border="4" borderColor="9966FF" Width="740" height="500" 
	bgcolor="#CCCCCC">
		<TR>
			<TD><B><font color="000000"><center> GTurbo's live stream:</font></b></center>
	<center><iframe width="720" height="480" src="https://player.twitch.tv/?channel=gturbo"
	-webkit-transform:scale(0.5);-moz-transform-scale(0.5);"></iframe>
	<div id="paypal-button-container"></div>
	<center></center></center>
	</td>

#2

It looks like your iframe parameters are a little garbled; there’s a couple style attributes and an out of place double quote. My assumption is that Chrome is still able to figure out a way to display it and Firefox is not. I would also recommend not using attributes like “bgcolor” and “text” as these are not compatible in HTML5. Here is a suggested edit for the iframe and using inline CSS:

<header>
	<title>GTurbo.Club - Home</title>
</header>
<body style="background-color: #333333; color: #CCCCCC;">
	<div style="text-align: center;">
		<h1 style="color: #9966FF;">Welcome to GTurbo.Club!</h1>
		<h5 style="color: #FFFF33;">This website is run off of Paypal Donations</h5>
	</div>

	<div style="text-align: center; margin: 0 auto; color: #000000; border: 4px solid #9966FF; width: 740px; height: 500px; background-color: #CCCCCC;">
		GTurbo's live stream:<br />
		<iframe
			src="https://player.twitch.tv/?channel=gturbo"
			height="480"
			width="720"
			frameborder="0">
		</iframe>
		<div id="paypal-button-container"></div>
	</div>
</body>