CSS issues in my script 1

[pmonett]

Greetings,

Beginner issue here. I'm having trouble understanding why my CSS is not working. I have a little project where I am to do a jackpot using JS. The functionality works, the three "wheels" get their random result, but when I want to display the values, I get the images one under the other instead of at the proper positions defined by CSS.
I have the same code running fine with PHP, so I know it is not a CSS issue.

My CSS code is as follows :

#wheel1{
	position:absolute;
	top:150px;
	left:250px;
	border:none;
	background-color:white;
}
#wheel2{
	position:absolute;
	top:150px;
	left:350px;
	border:none;
	background-color:white;
}
#wheel3{
	position:absolute;
	top:150px;
	left:450px;
	border:none;
	background-color:white;
}
#wheel{
	background-color:#aaaaaa;
	padding:3px;
	border:1px solid #000000;
}

My JS code that uses this is as follows :

		function pull_lever(){
			wheel1=rollwheel();
			wheel2=rollwheel();
			wheel3=rollwheel();
			document.write('<div id="wheel1"><p id="wheel">');
			document.write('<img src="'+wheel1+'" alt="'+wheel1+'"></p></div>');
			document.write('<div id="wheel2"><p id="wheel">');
			document.write('<img src="'+wheel2+'" alt="'+wheel2+'"></p></div>');
			document.write('<div id="wheel3"><p id="wheel">');
			document.write('<img src="'+wheel3+'" alt="'+wheel3+'"></p></div>');
		}

What do I need to do to get the CSS working with my JS code ? I must have missed something in the manuals somewhere.

Could someone point me in the right direction ?

Thanks,

Pascal.

I've got nothing to hide, and I'd very much like to keep that away from prying eyes.

 

[johnwm]

Using document.write causes your existing page to be overwritten, removing any CSS that you had defined. If you want to alter the content of an existing page, use a named div to contain each changeable object, then use the innerHTML property to change contents. See

http://www.w3schools.com/js/js_ex_dom.asp

If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller

 

[pmonett]

Thanks for your prompt response !

If I understand you correctly, what I need to do is rewrite my entire page in HTML instead of hammering it out in Javascript, and by assigning an ID to the divs of each section, I can dynamically modify the content ?

I've got nothing to hide, and I'd very much like to keep that away from prying eyes.

 

[johnwm]

Yes

If you want the best response to a question, please check out FAQ222-2244 first.
'If we're supposed to work in Hex, why have we only got A fingers?'
Drive a Steam Roller

 

[pmonett]

Thank you very much !

I've got nothing to hide, and I'd very much like to keep that away from prying eyes.