getElementbyID now working in FF on cflayout

in my code, I am changing the width of the cflayout tag using get element by id.

in IE, it seems to assume the ID as the name attribute. YOU CANNOT PUT AN ID on the CFLAYOUT itself.

everything works fine in ie, everytime you resize the window it resizes the cflayout to fill up the width.

The problem is that in FF and SAFARI, it says that ID is null. Can someone please tell me a workaround for this??

I basically have a div on the left that ios 150px wide and am floating the CFLAYOUT LEFT against it but want it to fill up the rest of the screen.

Thanks

Judson

<cflayout name="thelayout" type="border" style="height:500px;">
<cflayoutarea name="messageList" position="top" size="150" splitter="true" style="height:100%" source="dd_MessageList.cfm?path=#session.path#&folder=#trim(session.currentfolder)#"></cflayoutarea>
<cflayoutarea name="message" position="center" style="height:100%">Click message to view</cflayoutarea>
</cflayout>
</cfoutput>

<script language="Javascript">
window.init=changewidth();
function changewidth(){
	browser_detect = navigator.userAgent.toLowerCase();
	if 		((browser_detect.indexOf("safari") + 1)) 		{x = 'safari'; 	winW =+ window.innerWidth}
	else if ((browser_detect.indexOf("firefox") + 1)) 		{x = 'firefox'; winW =+ 200}
	else if ((browser_detect.indexOf("chrome") + 1)) 		{x = 'chrome'; 	winW =+ document.body.offsetWidth - 153}
	else if ((navigator.appName.indexOf("Microsoft")!=-1))  {x ='Microsoft'; winW =+ document.body.offsetWidth - 153}
	alert(x);	
	document.getElementById("thelayout").style.width =winW;
	alert(document.getElementById("thelayout").style.width=winW)
	}
	
	document.body.onresize = function (){
	changewidth()
	}
</script>

Select allOpen in new window